API Docs for: HTML-14.04-dev~bzr202

Class UbuntuUI.Page

Class defined in: page.js:23

One of the navigation pattern that can be used within an Ubuntu App is the deep navigation. This pattern is implemented by the Pagestack. A Pagestack contains one or more Pages. Each page displays full-screen. See the Pagestack class.

Each Page must have <em>id</em> and <em>data-title</em> attributes. The <em>id</em> attribute is used a unique reference to push the Page to the top of the Pagestack (see the Pagestack class). The <em>data-title</em> attribute is used to update the Header title as pages are pushed and poped.

UbuntuUI.Page( )
page.js:23
Example
 </body>
       <div data-role="mainview">
    
         <header data-role="header">
         </header>
    
         <div data-role="content">
           <div data-role="pagestack">
             <div data-role="page" data-title="Main" id="main">
               [...]
             </div>
             <div data-role="page" data-title="My Data" id="data">
               [...]
             </div>
           </div>
         </div>
    
       </div>
     </body>
    
     JavaScript access:
     var page = UI.page("pageID");
activate( properties )
page.js:109

Activates the current page.

Parameters:
  • properties <Object>
    • Data to be passed down to any activation callback listening for the page activation (see Page.onactivated)
deactivate( )
page.js:101

Deactivates the current page.

element( )
page.js:67

Returns the DOM element associated with the selector this widget is bind to.

Example
  var mypage = UI.page("pageid").element();
Boolean isPage( )
page.js:182

Validates that a given DOM node element is a Ubuntu UI Page.


Returns: <Boolean>

if the DOM element is a page

onactivated( callback )
page.js:121

Activates the current page.

Parameters:
  • callback <Function>
    • Callback function called with activation properties (from Pagestack.push) when the page is activated
actions <List>
page.js:77

actions property.

title <String>
page.js:89

title property.