MDL-30617 Adjustments to styling of module chooser

These changes fix several points and suggested changes:
* increase the size of the help popup to 800x600
* fix issues with centering of the dialogue
* swap next/cancel buttons
* convert next button to use string for 'Add'
* convert add text to 'Add an activity or resource'
This commit is contained in:
Andrew Robert Nicols 2012-05-18 09:55:04 +01:00
parent eeba64d02e
commit af75421c54
4 changed files with 23 additions and 13 deletions

View File

@ -208,10 +208,10 @@ class core_course_renderer extends plugin_renderer_base {
$formcontent .= html_writer::end_tag('div'); // types
$formcontent .= html_writer::start_tag('div', array('class' => 'submitbuttons'));
$formcontent .= html_writer::tag('input', '',
array('type' => 'submit', 'name' => 'submitbutton', 'id' => 'submitbutton', 'value' => get_string('next')));
$formcontent .= html_writer::tag('input', '',
array('type' => 'submit', 'name' => 'addcancel', 'id' => 'addcancel', 'value' => get_string('cancel')));
$formcontent .= html_writer::tag('input', '',
array('type' => 'submit', 'name' => 'submitbutton', 'id' => 'submitbutton', 'value' => get_string('add')));
$formcontent .= html_writer::end_tag('div');
$formcontent .= html_writer::end_tag('form');

View File

@ -47,8 +47,8 @@ YUI.add('moodle-course-modchooser', function(Y) {
'option' : ''
};
var options = [
'height=400',
'width=500',
'height=600',
'width=800',
'top=0',
'left=0',
'menubar=0',

View File

@ -66,7 +66,7 @@ $string['addnewuser'] = 'Add a new user';
$string['addnousersrecip'] = 'Add users who haven\'t accessed this {$a} to recipient list';
$string['addpagehere'] = 'Add page here';
$string['addresource'] = 'Add a resource...';
$string['addresourceoractivity'] = 'Add a resource or activity';
$string['addresourceoractivity'] = 'Add an activity or resource';
$string['address'] = 'Address';
$string['addstudent'] = 'Add student';
$string['addsubcategory'] = 'Add a sub-category';

View File

@ -58,9 +58,6 @@ YUI.add('moodle-core-chooserdialogue', function(Y) {
var bb = this.overlay.get('boundingBox');
var dialogue = this.container.one('.alloptions');
// Set the dialogue height
this.calculate_height(dialogue);
// These will trigger a check_options call to display the correct help
this.container.on('click', this.check_options, this);
this.container.on('key_up', this.check_options, this);
@ -87,6 +84,9 @@ YUI.add('moodle-core-chooserdialogue', function(Y) {
// Display the overlay
this.overlay.show();
// Re-centre the dialogue after we've shown it.
this.center_dialogue(dialogue);
// Finally, focus the first radio element - this enables form selection via the keyboard
this.container.one('.option input[type=radio]').focus();
@ -102,8 +102,11 @@ YUI.add('moodle-core-chooserdialogue', function(Y) {
* @param dialogue Y.Node The dialogue
* @return void
*/
calculate_height : function(dialogue) {
var winheight = this.overlay.get('boundingBox').get('winHeight');
center_dialogue : function(dialogue) {
var bb = this.overlay.get('boundingBox');
var winheight = bb.get('winHeight');
var offsettop = 0;
// Try and set a sensible max-height -- this must be done before setting the top
// Set a default height of 640px
@ -119,18 +122,25 @@ YUI.add('moodle-core-chooserdialogue', function(Y) {
// Set a fixed position if the window is large enough
if (newheight > this.get('minheight')) {
this.overlay.get('boundingBox').setStyle('position', 'fixed');
bb.setStyle('position', 'fixed');
} else {
this.overlay.get('boundingBox').setStyle('position', 'absolute');
bb.setStyle('position', 'absolute');
offsettop = Y.one('window').get('scrollTop');
}
// Take off 15px top and bottom for borders, plus 40px each for the title and button area before setting the
// new max-height
var totalheight = newheight;
newheight = newheight - (15 + 15 + 40 + 40);
dialogue.setStyle('max-height', newheight + 'px');
dialogue.setStyle('height', newheight + 'px');
// Re-calculate the location now that we've changed the size
this.overlay.centerDialogue();
var dialoguetop = Math.max(12, ((winheight - totalheight) / 2)) + offsettop;
// We need to set the height for the yui3-widget - can't work
// out what we're setting at present -- shoud be the boudingBox
bb.setStyle('top', dialoguetop + 'px');
},
handle_key_press : function(e) {
if (e.keyCode == 27) {