Skip to content

Commit 4acdfa1

Browse files
committed
Controlgroup: Address review comments
1 parent 344ce3c commit 4acdfa1

File tree

3 files changed

+41
-45
lines changed

3 files changed

+41
-45
lines changed

demos/controlgroup/toolbar.html

Lines changed: 10 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -73,15 +73,16 @@
7373
$( "#zoom" ).on( "selectmenuchange", function() {
7474
page.css({ "zoom": $( this ).val() });
7575
})
76-
$( basicControls.concat( valueControls ).join( ", " ) ).on( "click change selectmenuchange", function() {
76+
$( basicControls.concat( valueControls ).join( ", " ) ).on( "click change selectmenuchange",
77+
function() {
7778
document.execCommand(
7879
this.id,
7980
false,
8081
$( this ).val()
8182
);
82-
});
83+
} );
8384
$( "form" ).on( "submit", function( event ) {
84-
return false;
85+
event.preventDefault();
8586
});
8687
</script>
8788
</head>
@@ -92,7 +93,7 @@
9293
<button id="undo">Undo</button>
9394
<button id="redo">Redo</button>
9495
<select id="zoom">
95-
<option value="100%" selected>Zoom</option>
96+
<option selected disabled>Zoom</option>
9697
<option>50%</option>
9798
<option>75%</option>
9899
<option>90%</option>
@@ -102,7 +103,7 @@
102103
<option>200%</option>
103104
</select>
104105
<select id="fontname">
105-
<option value="Lucida Grande" selected>Font</option>
106+
<option selected disabled>Font</option>
106107
<option>Arial</option>
107108
<option>Comic Sans MS</option>
108109
<option>Courier New</option>
@@ -113,7 +114,7 @@
113114
<option>Verdana</option>
114115
</select>
115116
<select id="fontsize">
116-
<option value="3" selected>Size</option>
117+
<option selected disabled>Size</option>
117118
<option value="1">8px</option>
118119
<option value="2">9px</option>
119120
<option value="3">10px</option>
@@ -126,7 +127,7 @@
126127
<option value="10">36px</option>
127128
</select>
128129
<select id="hilitecolor" title="Background color">
129-
<option value="white">Highlight</option>
130+
<option selected disabled>Highlight</option>
130131
<option value="white">None</option>
131132
<option value="red">Red</option>
132133
<option value="yellow">Yellow</option>
@@ -136,8 +137,8 @@
136137
<option value="purple">Purple</option>
137138
<option value="orange">Orange</option>
138139
</select>
139-
<select id="forecolor">
140-
<option value="black" selected>Color</option>
140+
<select id="forecolor" title="Color">
141+
<option selected disabled>Color</option>
141142
<option value="black">Black</option>
142143
<option value="white">White</option>
143144
<option value="red">Red</option>

themes/base/controlgroup.css

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2,7 +2,7 @@
22
* jQuery UI Controlgroup @VERSION
33
* http://jqueryui.com
44
*
5-
* Copyright 2013 jQuery Foundation and other contributors
5+
* Copyright jQuery Foundation and other contributors
66
* Released under the MIT license.
77
* http://jquery.org/license
88
*
@@ -60,7 +60,7 @@
6060
margin: .4em;
6161
padding: 0;
6262

63-
/* Support IE8, Android < 4.4 */
63+
/* Support: IE8 only, Android < 4.4 only */
6464
width: 85%;
6565
width: calc( 100% - 22px );
6666
}

ui/widgets/controlgroup.js

Lines changed: 29 additions & 34 deletions
Original file line numberDiff line numberDiff line change
@@ -34,16 +34,16 @@ return $.widget( "ui.controlgroup", {
3434
version: "@VERSION",
3535
defaultElement: "<div>",
3636
options: {
37+
direction: "horizontal",
3738
disabled: null,
39+
excludeInvisible: true,
3840
items: {
3941
"button": "input[type=button], input[type=submit], input[type=reset], button, a",
42+
"controlgroupLabel": ".ui-controlgroup-label",
4043
"checkboxradio": "input[type='checkbox'], input[type='radio']",
4144
"selectmenu": "select",
42-
"spinner": ".ui-spinner-input",
43-
"controlgroupLabel": ".ui-controlgroup-label"
44-
},
45-
direction: "horizontal",
46-
excludeInvisible: true
45+
"spinner": ".ui-spinner-input"
46+
}
4747
},
4848

4949
_create: function() {
@@ -80,15 +80,16 @@ return $.widget( "ui.controlgroup", {
8080
// Make sure the widget actually exists and has a selector set
8181
if ( $.fn[ widget ] && selector ) {
8282

83-
// Find instances of this widget inside controlgroup and set options
83+
// Find instances of this widget inside controlgroup init them
8484
widgets = that.element.find( selector )[ widget ]( options );
8585

8686
widgets.each( function() {
87-
var element = $( this ),
87+
var element = $( this );
88+
89+
// Store an instance of the controlgroup to be able to refrence
90+
var widgetElement = element[ widget ]( "widget" );
8891

89-
// Set data on the widget element pointing to the this.element of the widget
90-
// and telling us what type of widget this is
91-
widgetElement = element[ widget ]( "widget" ).data(
92+
widgetElement.data(
9293
"ui-controlgroup-data",
9394
element.data( "ui-" + widget.charAt( 0 ).toUpperCase() + widget.slice( 1 ) )
9495
);
@@ -101,7 +102,7 @@ return $.widget( "ui.controlgroup", {
101102
$( this ).contents().wrapAll( "<span class='ui-controlgroup-label-contents'></span>" );
102103
} );
103104
that._addClass( labels, null, "ui-widget ui-widget-content ui-state-default" );
104-
Array.prototype.push.apply( childWidgets, labels.get() );
105+
childWidgets = childWidgets.concat( labels.get() );
105106
}
106107
} );
107108

@@ -120,15 +121,15 @@ return $.widget( "ui.controlgroup", {
120121
},
121122

122123
_updateCornerClass: function( element, position ) {
123-
var direction = this.options.direction === "vertical",
124-
remove = "ui-corner-top ui-corner-bottom ui-corner-left ui-corner-right",
125-
add = this._buildSimpleOptions( position, direction, "label" ).classes.label;
124+
var remove = "ui-corner-top ui-corner-bottom ui-corner-left ui-corner-right";
125+
var add = this._buildSimpleOptions( position, "label" ).classes.label;
126126

127127
this._removeClass( element, null, remove );
128128
this._addClass( element, null, add );
129129
},
130130

131-
_buildSimpleOptions: function( position, direction, key ) {
131+
_buildSimpleOptions: function( position, key ) {
132+
var direction = this.options.direction === "vertical";
132133
var result = {
133134
classes: {}
134135
};
@@ -141,24 +142,25 @@ return $.widget( "ui.controlgroup", {
141142
return result;
142143
},
143144

144-
_spinnerOptions: function( position, direction ) {
145-
var options = this._buildSimpleOptions( position, direction, "ui-spinner" );
145+
_spinnerOptions: function( position ) {
146+
var options = this._buildSimpleOptions( position, "ui-spinner" );
146147

147148
options.classes[ "ui-spinner-up" ] = "";
148149
options.classes[ "ui-spinner-down" ] = "";
149150

150151
return options;
151152
},
152153

153-
_buttonOptions: function( position, direction ) {
154-
return this._buildSimpleOptions( position, direction, "ui-button" );
154+
_buttonOptions: function( position ) {
155+
return this._buildSimpleOptions( position, "ui-button" );
155156
},
156157

157-
_checkboxradioOptions: function( position, direction ) {
158-
return this._buildSimpleOptions( position, direction, "ui-checkboxradio-label" );
158+
_checkboxradioOptions: function( position ) {
159+
return this._buildSimpleOptions( position, "ui-checkboxradio-label" );
159160
},
160161

161-
_selectmenuOptions: function( position, direction ) {
162+
_selectmenuOptions: function( position ) {
163+
var direction = this.options.direction === "vertical";
162164
return {
163165
width: direction ? "auto" : false,
164166
classes: {
@@ -167,16 +169,12 @@ return $.widget( "ui.controlgroup", {
167169
"ui-selectmenu-button-closed": null
168170
},
169171
first: {
170-
"ui-selectmenu-button-open":
171-
"ui-corner-" + ( direction ? "top" : "tl" ),
172-
"ui-selectmenu-button-closed":
173-
"ui-corner-" + ( direction ? "top" : "left" )
172+
"ui-selectmenu-button-open": "ui-corner-" + ( direction ? "top" : "tl" ),
173+
"ui-selectmenu-button-closed": "ui-corner-" + ( direction ? "top" : "left" )
174174
},
175175
last: {
176-
"ui-selectmenu-button-open":
177-
direction ? null : "ui-corner-tr",
178-
"ui-selectmenu-button-closed":
179-
"ui-corner-" + ( direction ? "bottom" : "right" )
176+
"ui-selectmenu-button-open": direction ? null : "ui-corner-tr",
177+
"ui-selectmenu-button-closed": "ui-corner-" + ( direction ? "bottom" : "right" )
180178
}
181179

182180
}[ position ]
@@ -224,10 +222,7 @@ return $.widget( "ui.controlgroup", {
224222

225223
if ( instance && that[ "_" + instance.widgetName + "Options" ] ) {
226224
instance.element[ instance.widgetName ](
227-
that[ "_" + instance.widgetName + "Options" ](
228-
value,
229-
that.options.direction === "vertical"
230-
)
225+
that[ "_" + instance.widgetName + "Options" ]( value )
231226
);
232227
} else {
233228
that._updateCornerClass( children[ value ](), value );

0 commit comments

Comments
 (0)