Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

MDL-34119_M23 theme_splash: Added colourswitcher.js and associated co…

…de in layout files and lib.php
  • Loading branch information...
commit 3705a88629ce209aef8bb2dfb62c870efafe8867 1 parent 263e8c1
Mary Evans authored June 30, 2012
2  theme/splash/config.php
@@ -152,3 +152,5 @@
152 152
 );
153 153
 
154 154
 $THEME->csspostprocess = 'splash_process_css';
  155
+
  156
+$THEME->javascripts = array('colourswitcher');
63  theme/splash/javascript/colourswitcher.js
... ...
@@ -0,0 +1,63 @@
  1
+YUI.add('moodle-theme_splash-colourswitcher', function(Y) {
  2
+
  3
+// Available colours
  4
+var COLOURS = ['red','green','blue','orange'];
  5
+
  6
+/**
  7
+ * Splash theme colour switcher class.
  8
+ * Initialise this class by calling M.theme_splash.init
  9
+ */
  10
+var ColourSwitcher = function() {
  11
+    ColourSwitcher.superclass.constructor.apply(this, arguments);
  12
+};
  13
+ColourSwitcher.prototype = {
  14
+    /**
  15
+     * Constructor for this class
  16
+     * @param {object} config
  17
+     */
  18
+    initializer : function(config) {
  19
+        var i, c;
  20
+        // Attach events to the links to change colours so we can do it with
  21
+        // JavaScript without refreshing the page
  22
+        for (i in COLOURS) {
  23
+            c = COLOURS[i];
  24
+            // Check if this is the current colour
  25
+            if (Y.one(document.body).hasClass('splash-'+c)) {
  26
+                this.set('colour', c);
  27
+            }
  28
+            Y.all(config.div+' .colour-'+c).on('click', this.setColour, this, c);
  29
+        }
  30
+    },
  31
+    /**
  32
+     * Sets the colour being used for the splash theme
  33
+     * @param {Y.Event} e The event that fired
  34
+     * @param {string} colour The new colour
  35
+     */
  36
+    setColour : function(e, colour) {
  37
+        // Prevent the event from refreshing the page
  38
+        e.preventDefault();
  39
+        // Switch over the CSS classes on the body
  40
+        Y.one(document.body).replaceClass('splash-'+this.get('colour'), 'splash-'+colour);
  41
+        // Update the current colour
  42
+        this.set('colour', colour);
  43
+        // Store the users selection (Uses AJAX to save to the database)
  44
+        M.util.set_user_preference('theme_splash_chosen_colour', colour);
  45
+    }
  46
+};
  47
+// Make the colour switcher a fully fledged YUI module
  48
+Y.extend(ColourSwitcher, Y.Base, ColourSwitcher.prototype, {
  49
+    NAME : 'Splash theme colour switcher',
  50
+    ATTRS : {
  51
+        colour : {
  52
+            value : 'red'
  53
+        }
  54
+    }
  55
+});
  56
+// Our splash theme namespace
  57
+M.theme_splash = M.theme_splash || {};
  58
+// Initialisation function for the colour switcher
  59
+M.theme_splash.initColourSwitcher = function(cfg) {
  60
+    return new ColourSwitcher(cfg);
  61
+}
  62
+
  63
+}, '@VERSION@', {requires:['base','node']});
1  theme/splash/layout/general.php
@@ -32,6 +32,7 @@
32 32
 $hascustommenu = (empty($PAGE->layout_options['nocustommenu']) && !empty($custommenu));
33 33
 
34 34
 splash_check_colourswitch();
  35
+splash_initialise_colourswitcher($PAGE);
35 36
 
36 37
 $bodyclasses = array();
37 38
 $bodyclasses[] = 'splash-'.splash_get_colour();
1  theme/splash/layout/report.php
@@ -32,6 +32,7 @@
32 32
 $hascustommenu = (empty($PAGE->layout_options['nocustommenu']) && !empty($custommenu));
33 33
 
34 34
 splash_check_colourswitch();
  35
+splash_initialise_colourswitcher($PAGE);
35 36
 
36 37
 $bodyclasses = array();
37 38
 $bodyclasses[] = 'splash-'.splash_get_colour();
13  theme/splash/lib.php
@@ -88,6 +88,19 @@ function splash_set_customcss($css, $customcss) {
88 88
 }
89 89
 
90 90
 /**
  91
+ * Adds the JavaScript for the colour switcher to the page.
  92
+ *
  93
+ * The colour switcher is a YUI moodle module that is located in
  94
+ *     theme/splash/yui/splash/splash.js
  95
+ *
  96
+ * @param moodle_page $page
  97
+ */
  98
+function splash_initialise_colourswitcher(moodle_page $page) {
  99
+    user_preference_allow_ajax_update('theme_splash_chosen_colour', PARAM_ALPHA);
  100
+    $page->requires->yui_module('moodle-theme_splash-colourswitcher', 'M.theme_splash.initColourSwitcher', array(array('div'=>'#colourswitcher')));
  101
+}
  102
+
  103
+/**
91 104
  * Gets the colour the user has selected, or the default if they have never changed
92 105
  *
93 106
  * @param string $default The default colour to use, normally red

0 notes on commit 3705a88

Please sign in to comment.
Something went wrong with that request. Please try again.