← Back to branch summary

~abreu-alexandre/ubuntu-html5-theme/add-button-class-ubuntu

« back to all changes in this revision

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

  • Committer: Tarmac
  • Author(s): Kyle Nitzsche
  • Date: 2013-11-01 20:38:57 UTC
  • mfrom: (90.1.4 trunk)
  • Revision ID: tarmac-20131101203857-o50mfgnebkogb950
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.

Approved by PS Jenkins bot, David Barth.

Show diffs side-by-side

added added

removed removed

Lines of Context:
0.1/ambiance/js/toolbars.js
20
20
 * <http://www.gnu.org/licenses/>.
21
21
 */
22
22
 
23
 
/* Toolbars */
 
23
/**
 
24
 * A Toolbar is the JavaScript representation of an Ubuntu HTML5 app <em>footer</em>. 
 
25
 
 
26
######Contained List provides buttons
 
27
The Toolbar contains a List, where each list item is treated as a Button (see below). List items (Buttons) are pushed to the right. The default Back button always exists to the left and does not need to be declared. 
 
28
 
 
29
#####Default and custom footers
 
30
See the Pagestack class documentation for information about the default application-wide Footer, customizing it, and adding Page-specific Footers.
 
31
 * @class Toolbar
 
32
 * @constructor
 
33
 * @namespace UbuntuUI
 
34
 * @example
 
35
      <footer data-role="footer" class="revealed" id="footerID">
 
36
        <div data-role="list">
 
37
          <ul>
 
38
            <li>
 
39
              <a href="#" id="home">Home</a>
 
40
            </li>
 
41
          </ul>
 
42
        </div>
 
43
      </footer>
 
44
 
 
45
      JavaScript access:
 
46
      var toolbar = UI.footer("footerID");
 
47
      UI.button('home').click(function () {
 
48
        UI.pagestack.push("main");
 
49
      });
 
50
 
 
51
 */
 
52
 
24
53
var Toolbar = function (UbuntuUI, id) {
25
54
    this.toolbar = document.getElementById(id);
26
55
};
27
56
 
28
57
Toolbar.prototype = {
 
58
    /**-
 
59
     * Display a Toolbar
 
60
     * @method show
 
61
     */
29
62
    show: function () {
30
63
        this.toolbar.classList.add('revealed');
31
64
    },
 
65
    /**-
 
66
     * Hide a Toolbar
 
67
     * @method hide
 
68
     */
32
69
    hide: function () {
33
70
        this.toolbar.classList.remove('revealed');
34
71
    },
 
72
    /**
 
73
     * Toggle show/hide status of a Toolbar
 
74
     * @method toggle
 
75
     */
35
76
    toggle: function () {
36
77
        this.toolbar.classList.toggle('revealed');
37
78
    },
 
79
    /**
 
80
     * Provide a callback function that's called with the Toolbar is touched
 
81
     * @method touch
 
82
     * @param {Function} function - The function that is called when the Toolbar is touched
 
83
     */
38
84
    touch: function (callback) {
39
85
        this.toolbar.addEventListener(UbuntuUI.touchEvents.touchEnd, callback);
40
86
    }