| Index: trunk/extensions/EducationProgram/specials/SpecialEditCourse.php |
| — | — | @@ -21,7 +21,7 @@ |
| 22 | 22 | public function __construct() { |
| 23 | 23 | parent::__construct( 'EditCourse', 'ep-course', 'EPCourse', 'Courses', 'Course' ); |
| 24 | 24 | |
| 25 | | - $this->getOutput()->addModules( 'ep.datepicker' ); |
| | 25 | + $this->getOutput()->addModules( array( 'ep.datepicker', 'ep.combobox' ) ); |
| 26 | 26 | } |
| 27 | 27 | |
| 28 | 28 | /** |
| — | — | @@ -54,7 +54,6 @@ |
| 55 | 55 | 'type' => 'text', |
| 56 | 56 | 'label-message' => 'ep-course-edit-token', |
| 57 | 57 | 'maxlength' => 255, |
| 58 | | - 'required' => true, |
| 59 | 58 | 'size' => 20, |
| 60 | 59 | 'validation-callback' => function ( $value, array $alldata = null ) { |
| 61 | 60 | $strLen = strlen( $value ); |
| — | — | @@ -80,16 +79,22 @@ |
| 81 | 80 | 'required' => true, |
| 82 | 81 | ); |
| 83 | 82 | |
| | 83 | + $fieldFields = EPCourse::selectFields( 'field', array(), array( 'DISTINCT' ) ); |
| | 84 | + $fieldFields = array_merge( array( '' => '' ), $fieldFields ); |
| 84 | 85 | $fields['field'] = array ( |
| 85 | | - 'type' => 'text', |
| | 86 | + 'class' => 'EPHTMLCombobox', |
| 86 | 87 | 'label-message' => 'ep-course-edit-field', |
| 87 | 88 | 'required' => true, |
| | 89 | + 'options' => array_combine( $fieldFields, $fieldFields ), |
| 88 | 90 | ); |
| 89 | 91 | |
| | 92 | + $levels = EPCourse::selectFields( 'level', array(), array( 'DISTINCT' ) ); |
| | 93 | + $levels = array_merge( array( '' => '' ), $levels ); |
| 90 | 94 | $fields['level'] = array ( |
| 91 | | - 'type' => 'text', |
| | 95 | + 'class' => 'EPHTMLCombobox', |
| 92 | 96 | 'label-message' => 'ep-course-edit-level', |
| 93 | 97 | 'required' => true, |
| | 98 | + 'options' => array_combine( $levels, $levels ), |
| 94 | 99 | ); |
| 95 | 100 | |
| 96 | 101 | $langOptions = EPUtils::getLanguageOptions( $this->getLanguage()->getCode() ); |
| — | — | @@ -104,10 +109,13 @@ |
| 105 | 110 | } |
| 106 | 111 | ); |
| 107 | 112 | |
| | 113 | + $mcs = EPCourse::selectFields( 'mc', array(), array( 'DISTINCT' ) ); |
| | 114 | + $mcs = array_merge( array( '' => '' ), $mcs ); |
| 108 | 115 | $fields['mc'] = array ( |
| 109 | | - 'type' => 'text', |
| | 116 | + 'class' => 'EPHTMLCombobox', |
| 110 | 117 | 'label-message' => 'ep-course-edit-mc', |
| 111 | 118 | 'required' => true, |
| | 119 | + 'options' => array_combine( $mcs, $mcs ), |
| 112 | 120 | ); |
| 113 | 121 | |
| 114 | 122 | $fields['description'] = array ( |
| Index: trunk/extensions/EducationProgram/includes/EPHTMLDateField.php |
| — | — | @@ -2,6 +2,7 @@ |
| 3 | 3 | |
| 4 | 4 | /** |
| 5 | 5 | * HTMLForm date field input. |
| | 6 | + * Requires jquery.datepicker |
| 6 | 7 | * |
| 7 | 8 | * @since 0.1 |
| 8 | 9 | * |
| Index: trunk/extensions/EducationProgram/includes/EPHTMLCombobox.php |
| — | — | @@ -0,0 +1,32 @@ |
| | 2 | +<?php |
| | 3 | + |
| | 4 | +/** |
| | 5 | + * HTMLForm combobox field input. |
| | 6 | + * Requires easyui.combobox |
| | 7 | + * |
| | 8 | + * @since 0.1 |
| | 9 | + * |
| | 10 | + * @file EPHTMLCombobox.php |
| | 11 | + * @ingroup EducationProgram |
| | 12 | + * |
| | 13 | + * @licence GNU GPL v3 or later |
| | 14 | + * @author Jeroen De Dauw < jeroendedauw@gmail.com > |
| | 15 | + */ |
| | 16 | +class EPHTMLCombobox extends HTMLSelectField { |
| | 17 | + |
| | 18 | + public function __construct( $params ) { |
| | 19 | + parent::__construct( $params ); |
| | 20 | + $this->mClass .= " ep-combobox-tr"; |
| | 21 | + } |
| | 22 | + |
| | 23 | + function getInputHTML( $value ) { |
| | 24 | + return parent::getInputHTML( $value ); |
| | 25 | + } |
| | 26 | + |
| | 27 | + function validate( $value, $alldata ) { |
| | 28 | + // TODO: further validation |
| | 29 | + |
| | 30 | + return true; |
| | 31 | + } |
| | 32 | + |
| | 33 | +} |
| Index: trunk/extensions/EducationProgram/EducationProgram.php |
| — | — | @@ -78,6 +78,7 @@ |
| 79 | 79 | $wgAutoloadClasses['EPCA'] = dirname( __FILE__ ) . '/includes/EPCA.php'; |
| 80 | 80 | $wgAutoloadClasses['EPCAPager'] = dirname( __FILE__ ) . '/includes/EPCAPager.php'; |
| 81 | 81 | $wgAutoloadClasses['EPHTMLDateField'] = dirname( __FILE__ ) . '/includes/EPHTMLDateField.php'; |
| | 82 | +$wgAutoloadClasses['EPHTMLCombobox'] = dirname( __FILE__ ) . '/includes/EPHTMLCombobox.php'; |
| 82 | 83 | $wgAutoloadClasses['EPRevision'] = dirname( __FILE__ ) . '/includes/EPRevision.php'; |
| 83 | 84 | $wgAutoloadClasses['EPRevisionPager'] = dirname( __FILE__ ) . '/includes/EPRevisionPager.php'; |
| 84 | 85 | $wgAutoloadClasses['EPPageObject'] = dirname( __FILE__ ) . '/includes/EPPageObject.php'; |
| — | — | @@ -332,6 +333,20 @@ |
| 333 | 334 | ), |
| 334 | 335 | ); |
| 335 | 336 | |
| | 337 | +$wgResourceModules['ep.combobox'] = $moduleTemplate + array( |
| | 338 | + 'scripts' => array( |
| | 339 | + 'ep.combobox.js', |
| | 340 | + ), |
| | 341 | + 'styles' => array( |
| | 342 | + 'ep.combobox.css', |
| | 343 | + ), |
| | 344 | + 'dependencies' => array( |
| | 345 | + 'jquery.ui.core', |
| | 346 | + 'jquery.ui.widget', |
| | 347 | + 'jquery.ui.autocomplete', |
| | 348 | + ), |
| | 349 | +); |
| | 350 | + |
| 336 | 351 | $wgResourceModules['ep.formpage'] = $moduleTemplate + array( |
| 337 | 352 | 'scripts' => array( |
| 338 | 353 | 'ep.formpage.js', |
| Index: trunk/extensions/EducationProgram/resources/ep.combobox.css |
| — | — | @@ -0,0 +1,51 @@ |
| | 2 | +/** |
| | 3 | + * CSS for the Education Program MediaWiki extension. |
| | 4 | + * @see https://www.mediawiki.org/wiki/Extension:Education_Program |
| | 5 | + * |
| | 6 | + * Code borrowed from the Semantic Forms extension. |
| | 7 | + * https://www.mediawiki.org/wiki/Extension:Semantic_Forms |
| | 8 | + */ |
| | 9 | + |
| | 10 | +/* Override some jQuery UI settings */ |
| | 11 | +.ui-button { margin-left: -1px; } |
| | 12 | +.ui-button-icon-only .ui-button-text { padding: 0.35em; } |
| | 13 | +button.ui-button-icon-only { |
| | 14 | + width: 1.7em; |
| | 15 | + height: 1.5em; |
| | 16 | + vertical-align: bottom; |
| | 17 | + margin-top: 0.2em; |
| | 18 | +} /* button elements seem to need a little more width */ |
| | 19 | +/* Override CSS from Header Tabs extension, if tabs are used in the form */ |
| | 20 | +input.ep-combobox { |
| | 21 | + border: 1px #a6a6a6 solid; |
| | 22 | +} |
| | 23 | + |
| | 24 | +.ui-widget input, .ui-widget { |
| | 25 | + font-family: sans-serif; |
| | 26 | + font-size: 10pt; |
| | 27 | +} |
| | 28 | + |
| | 29 | +.ui-widget input.ui-widget-content { |
| | 30 | + padding-left: 0.2em; |
| | 31 | + margin: 0 0 0 .1em; |
| | 32 | +} |
| | 33 | + |
| | 34 | +.ui-menu-item .ui-state-hover { |
| | 35 | + background: #222288; |
| | 36 | + color: white; |
| | 37 | + border: none; |
| | 38 | +} |
| | 39 | +ul.ui-menu { |
| | 40 | + padding: 0 0 5px 0; |
| | 41 | + max-height: 200px; |
| | 42 | + overflow: auto; |
| | 43 | +} |
| | 44 | +.ui-menu .ui-menu-item a.ui-state-hover { |
| | 45 | + margin: auto; |
| | 46 | +} |
| | 47 | + |
| | 48 | +.ui-corner-left, .ui-corner-right, .ui-corner-all { |
| | 49 | + border-radius: 0; |
| | 50 | + -moz-border-radius: 0; |
| | 51 | + -webkit-border-radius: 0; |
| | 52 | +} |
| \ No newline at end of file |
| Index: trunk/extensions/EducationProgram/resources/ep.combobox.js |
| — | — | @@ -0,0 +1,131 @@ |
| | 2 | +/** |
| | 3 | + * JavasSript for the Education Program MediaWiki extension. |
| | 4 | + * @see https://www.mediawiki.org/wiki/Extension:Education_Program |
| | 5 | + * |
| | 6 | + * @licence GNU GPL v3 or later |
| | 7 | + * @author Jeroen De Dauw <jeroendedauw at gmail dot com> |
| | 8 | + */ |
| | 9 | + |
| | 10 | +(function( $, mw ) { |
| | 11 | + |
| | 12 | + $.widget( "ep.combobox", { |
| | 13 | + _create: function() { |
| | 14 | + var self = this, |
| | 15 | + select = this.element.hide(), |
| | 16 | + selected = select.children( ":selected" ), |
| | 17 | + value = selected.val() ? selected.text() : ""; |
| | 18 | + var input = this.input = $( "<input>" ) |
| | 19 | + .insertAfter( select ) |
| | 20 | + .val( value ) |
| | 21 | + .autocomplete({ |
| | 22 | + delay: 0, |
| | 23 | + minLength: 0, |
| | 24 | + source: function( request, response ) { |
| | 25 | + var matcher = new RegExp( $.ui.autocomplete.escapeRegex(request.term), "i" ); |
| | 26 | + response( select.children( "option" ).map(function() { |
| | 27 | + var text = $( this ).text(); |
| | 28 | + if ( this.value && ( !request.term || matcher.test(text) ) ) |
| | 29 | + return { |
| | 30 | + label: text.replace( |
| | 31 | + new RegExp( |
| | 32 | + "(?![^&;]+;)(?!<[^<>]*)(" + |
| | 33 | + $.ui.autocomplete.escapeRegex(request.term) + |
| | 34 | + ")(?![^<>]*>)(?![^&;]+;)", "gi" |
| | 35 | + ), "<strong>$1</strong>" ), |
| | 36 | + value: text, |
| | 37 | + option: this |
| | 38 | + }; |
| | 39 | + }) ); |
| | 40 | + }, |
| | 41 | + select: function( event, ui ) { |
| | 42 | + ui.item.option.selected = true; |
| | 43 | + self._trigger( "selected", event, { |
| | 44 | + item: ui.item.option |
| | 45 | + }); |
| | 46 | + }, |
| | 47 | + change: function( event, ui ) { |
| | 48 | + if ( !ui.item ) { |
| | 49 | + var matcher = new RegExp( "^" + $.ui.autocomplete.escapeRegex( $(this).val() ) + "$", "i" ), |
| | 50 | + valid = false; |
| | 51 | + select.children( "option" ).each(function() { |
| | 52 | + if ( $( this ).text().match( matcher ) ) { |
| | 53 | + this.selected = valid = true; |
| | 54 | + return false; |
| | 55 | + } |
| | 56 | + }); |
| | 57 | + return false; |
| | 58 | + } |
| | 59 | + } |
| | 60 | + }) |
| | 61 | + .addClass( "ui-widget ui-widget-content ui-corner-left ep-combobox" ); |
| | 62 | + |
| | 63 | + input.data( "autocomplete" )._renderItem = function( ul, item ) { |
| | 64 | + return $( "<li></li>" ) |
| | 65 | + .data( "item.autocomplete", item ) |
| | 66 | + .append( "<a>" + item.label + "</a>" ) |
| | 67 | + .appendTo( ul ); |
| | 68 | + }; |
| | 69 | + |
| | 70 | + this.button = $( "<button type='button'> </button>" ) |
| | 71 | + .attr( "tabIndex", -1 ) |
| | 72 | + .attr( "title", "Show All Items" ) |
| | 73 | + .insertAfter( input ) |
| | 74 | + .button({ |
| | 75 | + icons: { |
| | 76 | + primary: "ui-icon-triangle-1-s" |
| | 77 | + }, |
| | 78 | + text: false |
| | 79 | + }) |
| | 80 | + .removeClass( "ui-corner-all" ) |
| | 81 | + .addClass( "ui-corner-right ui-button-icon" ) |
| | 82 | + .css('cssText', 'padding: 0 !important; margin: 0 !important; -moz-border-radius: 0; -webkit-border-radius: 0; width: 1.7em;') |
| | 83 | + .click(function() { |
| | 84 | + // close if already visible |
| | 85 | + if ( input.autocomplete( "widget" ).is( ":visible" ) ) { |
| | 86 | + input.autocomplete( "close" ); |
| | 87 | + return; |
| | 88 | + } |
| | 89 | + |
| | 90 | + // work around a bug (likely same cause as #5265) |
| | 91 | + $( this ).blur(); |
| | 92 | + |
| | 93 | + // pass empty string as value to search for, displaying all results |
| | 94 | + input.autocomplete( "search", "" ); |
| | 95 | + input.focus(); |
| | 96 | + }); |
| | 97 | + }, |
| | 98 | + |
| | 99 | + destroy: function() { |
| | 100 | + this.input.remove(); |
| | 101 | + this.button.remove(); |
| | 102 | + this.element.show(); |
| | 103 | + $.Widget.prototype.destroy.call( this ); |
| | 104 | + } |
| | 105 | + }); |
| | 106 | + |
| | 107 | + $( document ).ready( function() { |
| | 108 | + |
| | 109 | + $( '.mw-htmlform-submit' ).click( function( e ) { |
| | 110 | + $( '.ui-autocomplete-input' ).each( function() { |
| | 111 | + var has = false, |
| | 112 | + $input = $( this ), |
| | 113 | + $select = $input.closest( 'td' ).find( 'select.ep-combobox-tr' ); |
| | 114 | + |
| | 115 | + $select.find( 'option' ).each( function() { |
| | 116 | + if ( $( this ).text() === $input.val() ) { |
| | 117 | + has = true; |
| | 118 | + } |
| | 119 | + } ); |
| | 120 | + |
| | 121 | + if ( !has ) { |
| | 122 | + $select.append( $( '<option>' ).val( $input.val() ).text( $input.val() ) ); |
| | 123 | + $select.val( $input.val() ); |
| | 124 | + } |
| | 125 | + } ); |
| | 126 | + } ); |
| | 127 | + |
| | 128 | + $( '.ep-combobox-tr' ).find( 'select' ).combobox(); |
| | 129 | + |
| | 130 | + } ); |
| | 131 | + |
| | 132 | +})( window.jQuery ); |
| \ No newline at end of file |