MDL-32727 - quiz: fix incorrect variable name in upgrade
[moodle.git] / lib / yui / chooserdialogue / chooserdialogue.js
CommitLineData
01e0e704
ARN
1YUI.add('moodle-core-chooserdialogue', function(Y) {
2
3 var CHOOSERDIALOGUE = function() {
4 CHOOSERDIALOGUE.superclass.constructor.apply(this, arguments);
5 }
6
7 Y.extend(CHOOSERDIALOGUE, Y.Base, {
8 // The overlay widget
9 overlay: null,
10
11 // The submit button - we disable this until an element is set
12 submitbutton : null,
13
14 // The chooserdialogue container
15 container : null,
16
17 setup_chooser_dialogue : function(bodycontent, headercontent, config) {
18 // Set Default options
19 var params = {
20 bodyContent : bodycontent.get('innerHTML'),
21 headerContent : headercontent.get('innerHTML'),
22 visible : false, // Hide by default
23 zindex : 100, // Display in front of other items
24 lightbox : true, // This dialogue should be modal
25 shim : true
26 }
27
28 // Override with additional options
29 for (paramkey in config) {
30 params[paramkey] = config[paramkey];
31 }
32
33 // Create the overlay
34 this.overlay = new M.core.dialogue(params);
35
36 // Remove the template for the chooser
37 bodycontent.remove();
38 headercontent.remove();
39
40 // Hide and then render the overlay
41 this.overlay.hide();
42 this.overlay.render();
43
44 // Set useful links
45 this.container = this.overlay.get('boundingBox').one('#choosercontainer');
46 this.options = this.container.all('.option input[type=radio]');
47 },
48 /**
49 * Display the module chooser
50 *
51 * @param e Event Triggering Event
52 * @return void
53 */
54 display_chooser : function (e) {
55 // Stop the default event actions before we proceed
56 e.preventDefault();
57
58 var bb = this.overlay.get('boundingBox');
59 var dialogue = this.container.one('.alloptions');
60
61 // Set the dialogue height
62 this.calculate_height(dialogue);
63
64 // These will trigger a check_options call to display the correct help
65 this.container.on('click', this.check_options, this);
66 this.container.on('key_up', this.check_options, this);
67 this.container.on('dblclick', function(e) {
68 if (e.target.ancestor('div.option')) {
69 this.check_options();
70 this.container.one('form').submit();
71 }
72 }, this);
73
74 // Hook onto the cancel button to hide the form
75 this.container.one('#addcancel').on('click', this.cancel_popup, this);
76
77 // Grab global keyup events and handle them
78 Y.one('document').on('keyup', this.handle_key_press, this);
79
80 // Add references to various elements we adjust
81 this.jumplink = this.container.one('#jump');
82 this.submitbutton = this.container.one('#submitbutton');
83
84 // Disable the submit element until the user makes a selection
85 this.submitbutton.set('disabled', 'true');
86
87 // Display the overlay
88 this.overlay.show();
89
90 // Finally, focus the first radio element - this enables form selection via the keyboard
91 this.container.one('.option input[type=radio]').focus();
92
93 // Trigger check_options to set the initial jumpurl
94 this.check_options();
95 },
96 /**
97 * Calculate the optimum height of the chooser dialogue
98 *
99 * This tries to set a sensible maximum and minimum to ensure that some options are always shown, and preferably
100 * all, whilst fitting the box within the current viewport
101 *
102 * @param dialogue Y.Node The dialogue
103 * @return void
104 */
105 calculate_height : function(dialogue) {
106 var winheight = this.overlay.get('boundingBox').get('winHeight');
107
108 // Try and set a sensible max-height -- this must be done before setting the top
109 // Set a default height of 640px
110 var newheight = this.get('maxheight');
111 if (winheight <= newheight) {
112 // Deal with smaller window sizes
113 if (winheight <= this.get('minheight')) {
114 newheight = this.get('minheight');
115 } else {
116 newheight = winheight;
117 }
118 }
119
120 // Set a fixed position if the window is large enough
121 if (newheight > this.get('minheight')) {
122 this.overlay.get('boundingBox').setStyle('position', 'fixed');
123 } else {
124 this.overlay.get('boundingBox').setStyle('position', 'absolute');
125 }
126
127 // Take off 15px top and bottom for borders, plus 40px each for the title and button area before setting the
128 // new max-height
129 newheight = newheight - (15 + 15 + 40 + 40);
130 dialogue.setStyle('max-height', newheight + 'px');
131
132 // Re-calculate the location now that we've changed the size
133 this.overlay.centerDialogue();
134 },
135 handle_key_press : function(e) {
136 if (e.keyCode == 27) {
137 this.cancel_popup(e);
138 }
139 },
140 cancel_popup : function (e) {
141 // Prevent normal form submission before hiding
142 e.preventDefault();
143 this.hide();
144 },
145 hide : function() {
146 // Detach the global keypress handler before hiding
147 Y.one('document').detach('keyup', this.handle_key_press, this);
148 this.container.detachAll();
149 this.overlay.hide();
150 },
151 check_options : function(e) {
152 // Check which options are set, and change the parent class
153 // to show/hide help as required
154 this.options.each(function(thisoption) {
155 var optiondiv = thisoption.get('parentNode').get('parentNode');
156 if (thisoption.get('checked')) {
157 optiondiv.addClass('selected');
158
159 // Trigger any events for this option
160 this.option_selected(thisoption);
161
162 // Ensure that the form may be submitted
163 this.submitbutton.removeAttribute('disabled');
164
165 // Ensure that the radio remains focus so that keyboard navigation is still possible
166 thisoption.focus();
167 } else {
168 optiondiv.removeClass('selected');
169 }
170 }, this);
171 },
172 option_selected : function(e) {
173 }
174 },
175 {
176 NAME : 'moodle-core-chooserdialogue',
177 ATTRS : {
178 minheight : {
179 value : 300
180 },
181 maxheight : {
182 value : 660
183 }
184 }
185 });
186 M.core = M.core || {};
187 M.core.chooserdialogue = CHOOSERDIALOGUE;
188},
189'@VERSION@', {
190 requires:['base', 'overlay', 'moodle-enrol-notification']
191}
192);