Demos: Remove uses of $.mobile.pageContainer

Author: arschmitz

demos/backbone-requirejs/index.php

@@ -42,7 +42,7 @@
 
       <h2>jQuery Mobile configuration</h2>
 
-      <p>The technique used in this <a href="backbone-require.html" rel="external">example page</a> is by no means the only technique available, but it is one of the most elegant.  The Backbone.js router is used exclusively to handle all hashchange events, and the jQuery Mobile <code>$.mobile.pageContainer.pagecontainer( "change", url, options )</code> method is used to programmatically change the page.</p>
+      <p>The technique used in this <a href="backbone-require.html" rel="external">example page</a> is by no means the only technique available, but it is one of the most elegant.  The Backbone.js router is used exclusively to handle all hashchange events, and the jQuery Mobile <code>.pagecontainer( "change", url, options )</code> method is used to programmatically change the page.</p>
 
       <p>Below are two internal jQuery Mobile properties that are turned off to allow this to happen:</p>
 
@@ -115,7 +115,7 @@
       } );
 </code>
 </pre>
-<p>Next, inside of the Backbone.js Router class object, we can respond to haschange events and manually call the <code>$.mobile.pageContainer.pagecontainer( "change" )</code> method.  Below is a small snippet of <strong>mobileRouter.js</strong>.</p>
+<p>Next, inside of the Backbone.js Router class object, we can respond to haschange events and manually call the <code>pagecontainer( "change" )</code> method.  Below is a small snippet of <strong>mobileRouter.js</strong>.</p>
 <pre>
 <code>
         // Backbone.js Routes
@@ -133,7 +133,7 @@
         home: function() {
 
             // Programatically changes to the categories page
-            $.mobile.pageContainer.pagecontainer( "change", "#categories" , {
+            $( ".ui-pagecontainer" ).pagecontainer( "change", "#categories" , {
 				reverse: false,
 				changeHash: false
 			});

demos/backbone-requirejs/js/routers/mobileRouter.js

@@ -16,6 +16,8 @@ define([
         // The Router constructor
         initialize: function() {
 
+            this.pagecontainer = $( ".ui-pagecontainer" ).pagecontainer( "instance" );
+
             // Instantiates a new Animal Category View
             this.animalsView = new CategoryView( { el: "#animals", collection: new CategoriesCollection( [] , { type: "animals" } ) } );
 
@@ -45,7 +47,7 @@ define([
         home: function() {
 
             // Programatically changes to the categories page
-            $.mobile.pageContainer.pagecontainer( "change", "#categories", {
+            this.pagecontainer.change( "#categories", {
 				reverse: false,
 				changeHash: false
 			});
@@ -68,11 +70,10 @@ define([
                 currentView.collection.fetch().done( function() {
 
                     // Programatically changes to the current categories page
-                    $.mobile.pageContainer.pagecontainer( "change", "#" + type, {
+                    this.pagecontainer.change( "#" + type, {
 						reverse: false,
 						changeHash: false
 					});
-    
                 } );
 
             }
@@ -81,7 +82,7 @@ define([
             else {
 
                 // Programatically changes to the current categories page
-                $.mobile.pageContainer.pagecontainer( "change", "#" + type, {
+                this.pagecontainer.change( "#" + type, {
 					reverse: false,
 					changeHash: false
 				});