-YUI().use('gallery-bootstrap');
-
-YUI.add('gallery-bootstrap', function(Y) {
-
-var NS = Y.namespace('Bootstrap');
-
-NS.initializer = function(e) {
- NS.dropdown_delegation();
- NS.expandable_delegation();
-};
-
-NS.expandable_delegation = function() {
- Y.delegate('click', function(e) {
- e.preventDefault();
-
- var target = e.currentTarget;
- if ( ! target.collapse ) {
- target.plug( Y.Bootstrap.Collapse );
- }
- target.collapse.toggle();
- }, document.body, '*[data-toggle="collapse"]' );
-};
-
-Y.on('domready', NS.initializer);
-
-}, '@VERSION@' ,{requires:[ 'gallery-bootstrap-dropdown', 'gallery-bootstrap-collapse', 'gallery-bootstrap-engine']});
-;
+// We need to actually use the code manually here as this is tricky do in
+// themes at present.
+YUI().use('moodle-theme_bootstrap-bootstrap', function(Y) {
+ Y.Moodle.theme_bootstrap.bootstrap.init();
+});
--- /dev/null
+/**
+The Moodle Bootstrap theme's bootstrap JavaScript
+
+@namespace Moodle
+@module theme_bootstrap-bootstrap
+**/
+
+/**
+The Moodle Bootstrap theme's bootstrap JavaScript
+
+@class Moodle.theme_bootstrap.bootstrap
+@uses node
+@uses selector-css3
+@constructor
+**/
+var CSS = {
+ ACTIVE: 'active'
+ },
+ SELECTORS = {
+ NAVBAR_BUTTON: '.btn-navbar',
+ // FIXME This is deliberately wrong because of a breaking issue in the upstream library.
+ TOGGLECOLLAPSE: '*[data-disabledtoggle="collapse"]',
+ NAV_COLLAPSE: '.nav-collapse'
+ },
+ NS = Y.namespace('Moodle.theme_bootstrap.bootstrap');
+
+/**
+ * Initialise the Moodle Bootstrap theme JavaScript
+ *
+ * @method init
+ */
+NS.init = function() {
+ // We must use these here and *must not* add them to the list of dependencies until
+ // Moodle fully supports the gallery.
+ // When debugging is disabled and we seed the Loader with out configuration, if these
+ // are in the requires array, then the Loader will try to load them from the CDN. It
+ // does not know that we have added them to the module rollup.
+ Y.use('gallery-bootstrap-dropdown',
+ 'gallery-bootstrap-collapse',
+ 'gallery-bootstrap-engine', function() {
+
+ // Set up expandable and show.
+ NS.setup_toggle_expandable();
+ NS.setup_toggle_show();
+
+ // Set up upstream dropdown delegation.
+ Y.Bootstrap.dropdown_delegation();
+ });
+};
+
+/**
+ * Setup toggling of the Toggle Collapse
+ *
+ * @method setup_toggle_expandable
+ * @private
+ */
+NS.setup_toggle_expandable = function() {
+ Y.delegate('click', this.toggle_expandable, Y.config.doc, SELECTORS.TOGGLECOLLAPSE, this);
+};
+
+/**
+ * Use the Y.Bootstrap.Collapse plugin to toggle collapse.
+ *
+ * @method toggle_expandable
+ * @private
+ * @param {EventFacade} e
+ */
+NS.toggle_expandable = function(e) {
+ if (typeof e.currentTarget.collapse === 'undefined') {
+ // Only plug if we haven't already.
+ e.currentTarget.plug(Y.Bootstrap.Collapse);
+
+ // The plugin will now catch the click and handle the toggle.
+ // We only need to do this when we plug the node for the first
+ // time.
+ e.currentTarget.collapse.toggle();
+ e.preventDefault();
+ }
+};
+
+/**
+ * Set up the show toggler for activating the navigation bar
+ *
+ * @method setup_toggle_show
+ * @private
+ */
+NS.setup_toggle_show = function() {
+ Y.delegate('click', this.toggle_show, Y.config.doc, SELECTORS.NAVBAR_BUTTON);
+};
+
+/**
+ * Toggle hiding of the navigation bar
+ *
+ * @method toggle_show
+ * @private
+ * @param {EventFacade} e
+ */
+NS.toggle_show = function(e) {
+ // Toggle the active class on both the clicked .btn-navbar and the .nav-collapse.
+ // Our CSS will set the height for these.
+ Y.one(SELECTORS.NAV_COLLAPSE).toggleClass(CSS.ACTIVE);
+ e.currentTarget.toggleClass(CSS.ACTIVE);
+};
