~ubuntu-branches/ubuntu/trusty/ubuntu-html5-theme/trusty-proposed

« back to all changes in this revision

Viewing changes to 0.1/ambiance/js/header.js

  • Committer: Package Import Robot
  • Author(s): Ubuntu daily release, Adnane Belmadiaf, daker, Kyle Nitzsche, Colin Watson, Alexandre Abreu, Ubuntu daily release
  • Date: 2014-01-07 23:46:53 UTC
  • mfrom: (1.1.7)
  • Revision ID: package-import@ubuntu.com-20140107234653-oagvm6guom4h9dvh
Tags: 0.1+14.04.20140107-0ubuntu1
[ Adnane Belmadiaf ]
* s/parentNode/parendNode Spaces instead of tabs. (LP: #1241215)
* Add option selector widget. (LP: #1232533)

[ daker ]
* Passe the UI variable name so we will not lock the variable. (LP:
  #1222878)
* Made variable declaration locale. (LP: #1222881)
* Fixed z-index for the list items aside. (LP: #1223973)
* s/parentNode/parendNode Spaces instead of tabs. (LP: #1241215)
* Space instead of tab. (LP: #1240682)
* Made list items with headers differentes. (LP: #1246446)
* Updated the progressbar component to match the design.
* Move tabs closer to what they should be, Expand API to match the QML
  one (at least at the Tabs level), .
* Add option selector widget. (LP: #1232533)

[ Kyle Nitzsche ]
* Add button id to "Invalid button ID" error message .
* This MR does three main things: 1) Implements yuidoc comments in all
  js files to support API doc generation, and provides yuidoc assets
  (theme dir and json file) needed to build the API docs. Bug LP:
  #1241029 3) Provides JS classes for shape and page with
  corresponding UbuntuUI prototype constructor functions. Bug LP:
  #1243248 4) Adds a getEl(UbuntuUIObject) to return the element for
  any Ubuntu class. Also LP: #1243248. (LP: #1243248, #1241029)

[ Colin Watson ]
* Make ubuntu-html5-theme Multi-Arch: foreign.

[ Alexandre Abreu ]
* Fix exec path in app-gallery app desktop file. (LP: #1235321)
* Add convenient element() function to most widgets ... (we might want
  to factor those out in a second step).
* Move tabs closer to what they should be, Expand API to match the QML
  one (at least at the Tabs level), .
* Add HTML5 webapp container package.

[ Ubuntu daily release ]
* Automatic snapshot from revision 98

Show diffs side-by-side

added added

removed removed

Lines of Context:
 
1
/*
 
2
 * Copyright (C) 2013 Adnane Belmadiaf <daker@ubuntu.com>
 
3
 * License granted by Canonical Limited
 
4
 *
 
5
 * This file is part of ubuntu-html5-theme.
 
6
 *
 
7
 * This package is free software; you can redistribute it and/or modify
 
8
 * it under the terms of the GNU Lesser General Public License as 
 
9
 * published by the Free Software Foundation; either version 3 of the 
 
10
 * License, or
 
11
 * (at your option) any later version.
 
12
 
 
13
 * This package is distributed in the hope that it will be useful,
 
14
 * but WITHOUT ANY WARRANTY; without even the implied warranty of
 
15
 * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 
16
 * GNU General Public License for more details.
 
17
 
 
18
 * You should have received a copy of the GNU Lesser General Public 
 
19
 * License along with this program. If not, see 
 
20
 * <http://www.gnu.org/licenses/>.
 
21
 */
 
22
 
 
23
/**
 
24
 * An Ubuntu Header wraps Tabs. Together they provide the main navigation widget at the top of an Ubuntu HTML5 app.
 
25
 
 
26
Declare the Header and its Tabs in HTML as a direct child of the top level Page as a sibling to the <em>content</em> div.
 
27
######Contained list provides Page navigation
 
28
A contained unordered list has list items, each of which has an anchor (&lt;a&gt;) whose <em>href</em> attribute is a hash char ("#") followed by a Page ID. Clicking the Header/Tabs allows the user to navigate to the Pages identified by these IDs.
 
29
 
 
30
 * @class Header
 
31
 * @constructor
 
32
 * @namespace UbuntuUI
 
33
 * @example
 
34
      <body>
 
35
        <div data-role="page">
 
36
          <header data-role="header" id="headerID">
 
37
            <div class="tabs-inner">
 
38
              <ul data-role="tabs">
 
39
                <li class="active" data-role="tab">
 
40
                  <a href="#main">Main</a>
 
41
                </li>
 
42
                <li data-role="tab">
 
43
                  <a href="#page2">Two</a>
 
44
                </li>
 
45
              </ul>
 
46
            </div>
 
47
          </header>
 
48
          <div data-role="content">
 
49
            [...]
 
50
          </div>
 
51
        </div>
 
52
      </body>
 
53
 
 
54
      JavaScript access:
 
55
      var header = UI.header("headerID");
 
56
 */
 
57
var Header= function (id) {
 
58
    this.id =  id;
 
59
};
 
60
 
 
61
Header.prototype = {
 
62
    /**
 
63
     * Returns the DOM element associated with the id this widget is bind to.
 
64
     * @method element
 
65
     * @example
 
66
        var myheader = UI.header("headerid").element();
 
67
     */
 
68
    element: function () {
 
69
        return document.getElementById(this.id);
 
70
    }
 
71
};