MDL-38904 Theme/JavaScript: Tidy up bootstrap JS
authorAndrew Nicols <andrew@nicols.co.uk>
Tue, 9 Apr 2013 21:25:05 +0000 (22:25 +0100)
committerAndrew Nicols <andrew@nicols.co.uk>
Tue, 9 Apr 2013 22:50:51 +0000 (23:50 +0100)
13 files changed:
theme/bootstrap/config.php
theme/bootstrap/javascript/headercollapse.js [deleted file]
theme/bootstrap/javascript/moodlebootstrap.js
theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-coverage.js [new file with mode: 0644]
theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-debug.js [new file with mode: 0644]
theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-min.js [new file with mode: 0644]
theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap.js [new file with mode: 0644]
theme/bootstrap/yui/src/bootstrap/build.json [new file with mode: 0644]
theme/bootstrap/yui/src/bootstrap/js/bootstrap.js [new file with mode: 0644]
theme/bootstrap/yui/src/bootstrap/js/bootstrapcollapse.js [moved from theme/bootstrap/javascript/bootstrapcollapse.js with 100% similarity]
theme/bootstrap/yui/src/bootstrap/js/bootstrapdropdown.js [moved from theme/bootstrap/javascript/bootstrapdropdown.js with 100% similarity]
theme/bootstrap/yui/src/bootstrap/js/bootstrapengine.js [moved from theme/bootstrap/javascript/bootstrapengine.js with 100% similarity]
theme/bootstrap/yui/src/bootstrap/meta/bootstrap.json [new file with mode: 0644]

index 31c7d28..5f121f5 100644 (file)
@@ -152,11 +152,9 @@ $THEME->layouts = array(
 );
 
 $THEME->javascripts = array(
-    'bootstrapengine',
+);
+$THEME->javascripts_footer = array(
     'moodlebootstrap',
-    'bootstrapcollapse',
-    'bootstrapdropdown',
-    'headercollapse',
 );
 
 $useragent = '';
diff --git a/theme/bootstrap/javascript/headercollapse.js b/theme/bootstrap/javascript/headercollapse.js
deleted file mode 100644 (file)
index 488d43e..0000000
+++ /dev/null
@@ -1,10 +0,0 @@
-YUI().use('node', function(Y) {
-    var toggleShow = function(e) {
-        // Toggle the active class on both the clicked .btn-navbar and the .nav-collapse.
-        // Our CSS will set the height for these
-        var togglemenu = Y.one('.nav-collapse');
-        togglemenu.toggleClass('active');
-        this.toggleClass('active');
-    };
-    Y.delegate('click', toggleShow, Y.config.doc, '.btn-navbar');
-});
index 85724f8..52a79b8 100644 (file)
@@ -1,27 +1,5 @@
-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();
+});
diff --git a/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-coverage.js b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-coverage.js
new file mode 100644 (file)
index 0000000..4f43606
Binary files /dev/null and b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-coverage.js differ
diff --git a/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-debug.js b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-debug.js
new file mode 100644 (file)
index 0000000..6dc4e93
Binary files /dev/null and b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-debug.js differ
diff --git a/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-min.js b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-min.js
new file mode 100644 (file)
index 0000000..5c950e6
Binary files /dev/null and b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap-min.js differ
diff --git a/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap.js b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap.js
new file mode 100644 (file)
index 0000000..b9cb5cb
Binary files /dev/null and b/theme/bootstrap/yui/build/moodle-theme_bootstrap-bootstrap/moodle-theme_bootstrap-bootstrap.js differ
diff --git a/theme/bootstrap/yui/src/bootstrap/build.json b/theme/bootstrap/yui/src/bootstrap/build.json
new file mode 100644 (file)
index 0000000..b8b6ac6
--- /dev/null
@@ -0,0 +1,15 @@
+{
+  "name": "moodle-theme_bootstrap-bootstrap",
+  "builds": {
+    "moodle-theme_bootstrap-bootstrap": {
+      "prependfiles": [
+        "bootstrapengine.js",
+        "bootstrapcollapse.js",
+        "bootstrapdropdown.js"
+      ],
+      "jsfiles": [
+        "bootstrap.js"
+      ]
+    }
+  }
+}
diff --git a/theme/bootstrap/yui/src/bootstrap/js/bootstrap.js b/theme/bootstrap/yui/src/bootstrap/js/bootstrap.js
new file mode 100644 (file)
index 0000000..2757862
--- /dev/null
@@ -0,0 +1,103 @@
+/**
+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);
+};
diff --git a/theme/bootstrap/yui/src/bootstrap/meta/bootstrap.json b/theme/bootstrap/yui/src/bootstrap/meta/bootstrap.json
new file mode 100644 (file)
index 0000000..d267ab3
--- /dev/null
@@ -0,0 +1,8 @@
+{
+  "moodle-theme_bootstrap-bootstrap": {
+    "requires": [
+        "node",
+        "selector-css3"
+    ]
+  }
+}