jamiebuilds · July 22, 2014 19:43 · Jul 22, 2014 · Jul 22, 2014 · Jul 22, 2014 · Jul 21, 2014
diff --git a/marionette.router-2.js b/marionette.router-2.js
@@ -9,7 +9,7 @@ app.router = new Marionette.Router({
     'profile': {
       url: 'profile',
       view: profileView,
-      controller: profileController
+      controller: ProfileController
     },
     'profile.settings': {
       url: 'profile/settings',
@@ -32,6 +32,31 @@ app.router.addState({
         view: YourView
       } 
     }
+  },
+  'whatever.popcorn': {
+    controller: PopcornController
   }
 });
 
+var PopcornController = Marionette.Controller.extend({
+  initialize: function(options) {
+
+    // All of the regions
+    this.regions;
+
+    // All of the views
+    this.views;
+
+    // The URL parts
+    this.urlParts;
+
+    // The query params
+    this.params;
+  }
+});
+
+// Attach this information directly to the Controller if you choose
+_.extend(PopcornController, {
+  view: MyView,
+  region: '.some-region'
+});
diff --git a/marionette.router-2.js b/marionette.router-2.js
@@ -22,8 +22,16 @@ app.router = new Marionette.Router({
 app.router.addState({
   'whatever': {
     url: 'whatever',
-    view: myView,
-    controller: whateverController
+    regions: {
+      'myRegion': {
+        selector: '.my-selector',
+        view: MyView
+      }
+      'yourRegion': {
+        selector: '.your-selector',
+        view: YourView
+      } 
+    }
   }
 });
 
diff --git a/marionette.router-2.js b/marionette.router-2.js
@@ -0,0 +1,29 @@
+// Create our Application
+var app = new Marionette.Application();
+
+// Attach a router to it
+app.router = new Marionette.Router({
+  channelName: 'myRouter',
+
+  states: {
+    'profile': {
+      url: 'profile',
+      view: profileView,
+      controller: profileController
+    },
+    'profile.settings': {
+      url: 'profile/settings',
+      region: '.some-selector'
+    }
+  }
+
+});
+
+app.router.addState({
+  'whatever': {
+    url: 'whatever',
+    view: myView,
+    controller: whateverController
+  }
+});
+
diff --git a/marionette.router.js b/marionette.router.js
@@ -33,13 +33,13 @@ app.router
     controller: settingsCtrl
   });
 
-// You can also configure it across different files
+// You can also configure it across different files. The use case for this is that
+// each 'module' sets up its own routes.
 app.router.state('friends', { ... });
 
 /*
  * Let's examine one of those controllers...
  */
-
 
 var profileCtrl = Marionette.Controller.extend({
 

diff --git a/marionette.router.js b/marionette.router.js
@@ -7,7 +7,7 @@ app.router = new Marionette.Router();
 // Configure our router
 app.router
 
-  // Each state has a name. This one is profile
+  // A router is a state machine. So we configure our states, by name.
   .state('profile', {
 
     // Matches the profile URL

diff --git a/marionette.router.js b/marionette.router.js
@@ -1,17 +1,57 @@
+// Create our Application
 var app = new Marionette.Application();
 
+// Attach a router to it
 app.router = new Marionette.Router();
 
+// Configure our router
 app.router
+
+  // Each state has a name. This one is profile
   .state('profile', {
+
+    // Matches the profile URL
     url: 'profile',
+
+    // The view to render in our region
     view: profileView,
-    region: '.my-region',
+
+    // Options to pass to the view. Also accepts a function that returns the options
+    viewOptions: myViewOptions,
+
+    // The controller for this state.
     controller: profileCtrl
   })
+
+  // Nest views with the dot syntax
   .state('profile.settings', {
     url: 'profile/settings',
     view: settingsView,
+
+    // Specify a custom selector for this view instead of the default.
     region: '.whatever-selector',
     controller: settingsCtrl
-  });
+  });
+
+// You can also configure it across different files
+app.router.state('friends', { ... });
+
+/*
+ * Let's examine one of those controllers...
+ */
+
+
+var profileCtrl = Marionette.Controller.extend({
+
+  // A new controller is instantiated everytime you navigate to the route
+  initialize: function(options) {
+
+    // An array of the views for this state
+    this.views = options.views;
+
+    // The model that is passed to each view. Add more data
+    // to it here if you want to
+    this.model = options.model;
+  }
+
+});
diff --git a/marionette.router.js b/marionette.router.js
@@ -5,11 +5,13 @@ app.router = new Marionette.Router();
 app.router
   .state('profile', {
     url: 'profile',
-    view: profileView
+    view: profileView,
+    region: '.my-region',
     controller: profileCtrl
   })
   .state('profile.settings', {
     url: 'profile/settings',
     view: settingsView,
+    region: '.whatever-selector',
     controller: settingsCtrl
   });
diff --git a/marionette.router.js b/marionette.router.js
@@ -2,3 +2,14 @@ var app = new Marionette.Application();
 
 app.router = new Marionette.Router();
 
+app.router
+  .state('profile', {
+    url: 'profile',
+    view: profileView
+    controller: profileCtrl
+  })
+  .state('profile.settings', {
+    url: 'profile/settings',
+    view: settingsView,
+    controller: settingsCtrl
+  });
diff --git a/marionette.router.js b/marionette.router.js
@@ -0,0 +1,4 @@
+var app = new Marionette.Application();
+
+app.router = new Marionette.Router();
+
Original file line number	Diff line number	Diff line change
		@@ -0,0 +1,4 @@
		var app = new Marionette.Application();

		app.router = new Marionette.Router();
No results found