[BC BREAK] Rename main view to ng-admin

marmelab · Nov 3, 2015 · cbd0341 · cbd0341
1 parent e746827
commit cbd0341
Show file tree

Hide file tree

Showing 7 changed files with 73 additions and 22 deletions.
diff --git a/README.md b/README.md
@@ -20,7 +20,7 @@ npm install ng-admin --save
 bower install ng-admin --save
 ```
 
-Add the `ng-admin.min.css` and `ng-admin.min.js` to the HTML, add a `<div ui-view>`, and configure the admin:
+Add the `ng-admin.min.css` and `ng-admin.min.js` to the HTML, add a `<div ui-view="ng-admin">`, and configure the admin:
 
 ```html
 <!doctype html>
@@ -30,7 +30,7 @@ Add the `ng-admin.min.css` and `ng-admin.min.js` to the HTML, add a `<div ui-vie
     <link rel="stylesheet" href="node_modules/ng-admin/build/ng-admin.min.css">
   </head>
   <body ng-app="myApp">
-    <div ui-view></div>
+    <div ui-view="nh-admin"></div>
     <script src="node_modules/ng-admin/build/ng-admin.min.js"></script>
     <script type="text/javascript">
     var myApp = angular.module('myApp', ['ng-admin']);

diff --git a/UPGRADE-1.0.md b/UPGRADE-1.0.md
@@ -0,0 +1,47 @@
+# Upgrade to 1.0
+
+## [BC Break] ng-admin now attaches to a named view
+
+Ng-admin used to attach to the following element in your main `index.html`:
+
+```js
+<div ui-view></div>
+```
+
+Starting with 1.0, you now have to name the ui-view of ng-admin:
+
+```js
+<div ui-view="ng-admin">
+```
+
+Not upgrading your `index.html` will result in a blank page.
+
+## [BC Break] Custom pages must use declare 'ng-admin' as parent instead of 'main'
+
+If you added [custom pages](doc/Custom-pages.md), you probably declared a route with a `parent: 'main'`. The main view isn't named 'parent' anymore, but 'ng-admin'. Therefore, all the state definitions for custom pages must be updated:
+
+```js
+// from
+myApp.config(function ($stateProvider) {
+    $stateProvider.state('send-post', {
+        parent: 'main',
+        url: '/sendPost/:id',
+        params: { id: null },
+        controller: sendPostController,
+        controllerAs: 'controller',
+        template: sendPostControllerTemplate
+    });
+});
+
+// to
+myApp.config(function ($stateProvider) {
+    $stateProvider.state('send-post', {
+        parent: 'ng-admin', // <= this has changed
+        url: '/sendPost/:id',
+        params: { id: null },
+        controller: sendPostController,
+        controllerAs: 'controller',
+        template: sendPostControllerTemplate
+    });
+});
+```
diff --git a/doc/Custom-pages.md b/doc/Custom-pages.md
@@ -9,7 +9,7 @@ ng-admin uses [AngularUI Router](https://github.com/angular-ui/ui-router) to def
 ```js
 myApp.config(function ($stateProvider) {
     $stateProvider.state('send-post', {
-        parent: 'main',
+        parent: 'ng-admin',
         url: '/sendPost/:id',
         params: { id: null },
         controller: sendPostController,
@@ -19,7 +19,7 @@ myApp.config(function ($stateProvider) {
 });
 ```
 
-Here the `controllerAs` property defines the name of the controller in the template. Also worth noting: `parent: 'main'` means that the "send-post" page will be displayed inside the main layout.
+Here the `controllerAs` property defines the name of the controller in the template. Also worth noting: `parent: 'ng-admin'` means that the "send-post" page will be displayed inside the main ng-admin layout.
 
 ## Page Controller and Template
 

diff --git a/examples/blog/config.js b/examples/blog/config.js
@@ -553,7 +553,7 @@
 
     app.config(['$stateProvider', function ($stateProvider) {
         $stateProvider.state('send-post', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/sendPost/:id',
             params: { id: null },
             controller: sendPostController,
@@ -564,15 +564,15 @@
 
     // custom page with menu item
     var customPageTemplate = '<div class="row"><div class="col-lg-12">' +
-            '<ma-view-actions><ma-back-button></ma-back-button></ma-view-actions>' +
             '<div class="page-header">' +
+                '<ma-view-actions><ma-back-button></ma-back-button></ma-view-actions>' +
                 '<h1>Stats</h1>' +
                 '<p class="lead">You can add custom pages, too</p>' +
             '</div>' +
         '</div></div>';
     app.config(['$stateProvider', function ($stateProvider) {
         $stateProvider.state('stats', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/stats',
             template: customPageTemplate
         });

diff --git a/examples/blog/index.html b/examples/blog/index.html
@@ -12,7 +12,7 @@
         </style>
     </head>
     <body ng-app="myApp" ng-strict-di>
-        <div ui-view></div>
+        <div ui-view="ng-admin"></div>
         <script src="build/fakerest.js" type="text/javascript"></script>
         <script src="build/sinon-server.js" type="text/javascript"></script>
         <script src="data.js" type="text/javascript"></script>

diff --git a/src/javascripts/ng-admin/Crud/routing.js b/src/javascripts/ng-admin/Crud/routing.js
@@ -46,7 +46,7 @@ function routing($stateProvider) {
             params: {
                 entity: null
             },
-            parent: 'main',
+            parent: 'ng-admin',
             controller: 'ListLayoutController',
             controllerAs: 'llCtrl',
             templateProvider: templateProvider('ListView', listLayoutTemplate),
@@ -142,7 +142,7 @@ function routing($stateProvider) {
 
     $stateProvider
         .state('show', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/:entity/show/:id?sortField&sortDir',
             controller: 'ShowController',
             controllerAs: 'showController',
@@ -235,7 +235,7 @@ function routing($stateProvider) {
 
     $stateProvider
         .state('create', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/:entity/create?{defaultValues:json}',
             controller: 'FormController',
             controllerAs: 'formController',
@@ -286,7 +286,7 @@ function routing($stateProvider) {
 
     $stateProvider
         .state('edit', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/:entity/edit/:id?sortField&sortDir',
             controller: 'FormController',
             controllerAs: 'formController',
@@ -393,7 +393,7 @@ function routing($stateProvider) {
 
     $stateProvider
         .state('delete', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/:entity/delete/:id',
             controller: 'DeleteController',
             controllerAs: 'deleteController',
@@ -432,7 +432,7 @@ function routing($stateProvider) {
 
     $stateProvider
         .state('batchDelete', {
-            parent: 'main',
+            parent: 'ng-admin',
             url: '/:entity/batch-delete/{ids:json}',
             controller: 'BatchDeleteController',
             controllerAs: 'batchDeleteController',

diff --git a/src/javascripts/ng-admin/Main/config/routing.js b/src/javascripts/ng-admin/Main/config/routing.js
@@ -16,17 +16,21 @@ function entryConstructorProvider() {
 
 function routing($stateProvider, $urlRouterProvider) {
 
-    $stateProvider.state('main', {
+    $stateProvider.state('ng-admin', {
         abstract: true,
-        controller: 'AppController',
-        controllerAs: 'appController',
-        templateProvider: ['NgAdminConfiguration', function(Configuration) {
-            return Configuration().layout() || layoutTemplate;
-        }]
+        views: {
+            'ng-admin': {
+                controller: 'AppController',
+                controllerAs: 'appController',
+                templateProvider: ['NgAdminConfiguration', function(Configuration) {
+                    return Configuration().layout() || layoutTemplate;
+                }]
+            }
+        }
     });
 
     $stateProvider.state('dashboard', {
-        parent: 'main',
+        parent: 'ng-admin',
         url: '/dashboard?sortField&sortDir',
         params: {
             sortField: null,
@@ -112,7 +116,7 @@ function routing($stateProvider, $urlRouterProvider) {
     });
 
     $stateProvider.state('ma-404', {
-        parent: 'main',
+        parent: 'ng-admin',
         template: errorTemplate
     });