Browse Source

Minor update to release

pull/258/head
jlukic 11 years ago
parent
commit
16f522e6bf
4 changed files with 72 additions and 57 deletions
  1. 9
      RELEASE NOTES.md
  2. 36
      server/documents/modules/dropdown.html.eco
  3. 16
      server/files/javascript/dropdown.js
  4. 68
      src/modules/dropdown.js

9
RELEASE NOTES.md

@ -1,5 +1,14 @@
## RELEASE NOTES
### Version 0.6.3 - Oct 15, 2013
**Deprecation**
- Dropdown changeText and updateForm have been deprecated and will be removed in 1.0
**Updates**
- Dropdown hide no longer selects current item as active (useful for menus)
- Simplified possible dropdown actions changeText and updateForm are now consolidated into activate which is the new default
### Version 0.6.2 - Oct 15, 2013
**Fixes**

36
server/documents/modules/dropdown.html.eco

@ -47,7 +47,7 @@ type : 'UI Module'
<h2 class="ui dividing header">Types</h2>
<div class="visible form example">
<div class="visible dropdown example">
<h4 class="ui header">Dropdown</h4>
<p>A basic dropdown has no special formatting of its own</p>
<div class="ui dropdown">
@ -61,7 +61,7 @@ type : 'UI Module'
</div>
</div>
<div class="form example">
<div class="dropdown example">
<h4 class="ui header">Inline</h4>
<p>A dropdown can be formatted to appear inline in other content</p>
<div>Show me posts trending
@ -69,7 +69,7 @@ type : 'UI Module'
<div class="text">today</div>
<i class="dropdown icon"></i>
<div class="menu">
<div class="active item" data-text="today">Today</div>
<div class="item" data-text="today">Today</div>
<div class="item" data-text="this week">This Week</div>
<div class="item" data-text="this month">This Month</div>
</div>
@ -77,7 +77,7 @@ type : 'UI Module'
</div>
</div>
<div class="form example">
<div class="dropdown example">
<h4 class="ui header">Selection</h4>
<p>A dropdown can be formatted to allow selection of a menu choice.</p>
<div class="ui selection dropdown">
@ -92,7 +92,7 @@ type : 'UI Module'
</div>
<div class="dropdown example">
<div class="button example">
<h4 class="ui header">Floating</h4>
<p>A dropdown menu can appear to be floating below an element.</p>
<div class="ui teal buttons">
@ -132,7 +132,7 @@ type : 'UI Module'
</div>
</div>
</div>
<div class="another dropdown example">
<div class="another button example">
<div class="ui blue labeled icon top left pointing dropdown button">
<i class="settings icon"></i>
<span class="text">Settings</span>
@ -152,7 +152,7 @@ type : 'UI Module'
</div>
</div>
</div>
<div class="another dropdown example">
<div class="another button example">
<div class="ui teal right pointing dropdown icon button">
<i class="settings icon"></i>
<div class="menu">
@ -189,7 +189,7 @@ type : 'UI Module'
<h2 class="ui dividing header">Examples</h2>
<div class="form example">
<div class="dropdown example">
<h4 class="ui header">Re-selecting values</h4>
<p>A dropdown will automatically select on page load any menu item that includes the currently value of <code>text</code> or your dropdown's hidden input value. This is used to preserve a user's selection on page navigation and will automatically remove and default text placeholder formatting.</p>
@ -253,7 +253,7 @@ type : 'UI Module'
</div>
</div>
<div class="form example">
<div class="dropdown example">
<h4 class="ui header">Multiple Levels</h4>
<p>A dropdown menu can also contain sub menus inside of it</p>
My favorite animal breed is <div class="ui inline dropdown">
@ -265,7 +265,7 @@ type : 'UI Module'
<i class="dropdown icon"></i>
Dogs
<div class="menu">
<div class="active item">Shiba Inu</div>
<div class="item">Shiba Inu</div>
<div class="item">Poodle</div>
<div class="item">Labrador</div>
</div>
@ -311,14 +311,14 @@ type : 'UI Module'
</a>
</div>
<div class="sub menu">
<div class="active item">Activity Feed</div>
<a class="item">Activity Feed</a>
<a class="item">Profile</a>
<a class="item">Events</a>
</div>
</div>
</div>
<div class="form example">
<div class="dropdown example">
<h4 class="ui header">Form</h4>
<p>A dropdown can be formatted to allow selection inside a <a href="/collection/form.html">form</a></p>
<div class="ui form segment">
@ -367,7 +367,7 @@ type : 'UI Module'
<h2 class="ui dividing header">Variations</h2>
<div class="form example">
<div class="dropdown example">
<h4 class="ui header">Fluid</h4>
<p>A dropdown can take the full width of its parent</p>
<div class="ui vertical menu">
@ -491,7 +491,7 @@ type : 'UI Module'
<td>Sets a default action to occur.
<div class="ui vertical divided list">
<div class="item">
<div class="header">auto</div>
<div class="header">activate</div>
<div class="description">Most likely action will be determined by type of dropdown, for example a selection dropdown will automatically use updateForm</div>
</div>
<div class="item">
@ -503,12 +503,8 @@ type : 'UI Module'
<div class="description">Dropdown menu is hidden</div>
</div>
<div class="item">
<div class="header">changeText</div>
<div class="description">dropdown menu is hidden and text field is changed</div>
</div>
<div class="item">
<div class="header">updateForm</div>
<div class="description">dropdown menu is hidden text field is changed and hidden input value is changed</div>
<div class="header">activate</div>
<div class="description">Dropdown menu is hidden, item activated and text is changed</div>
</div>
<div class="item">
<div class="header">function(){}</div>

16
server/files/javascript/dropdown.js

@ -7,7 +7,7 @@ semantic.dropdown.ready = function() {
var
$examples = $('.example'),
$hoverDropdown = $examples.filter('.hover').find('.ui.dropdown'),
$formDropdown = $examples.filter('.form').find('.ui.dropdown'),
$buttonDropdown = $examples.filter('.button.example').find('.ui.dropdown'),
$dropdown = $examples.filter('.dropdown').find('.ui.dropdown:not(.simple)'),
$transition = $examples.filter('.transition').find('.ui.dropdown'),
$transitionButton = $examples.filter('.transition').find('.ui.button').first(),
@ -35,19 +35,19 @@ semantic.dropdown.ready = function() {
})
;
$dropdown
.dropdown({
activate: true
})
.dropdown()
;
$formDropdown
$hoverDropdown
.dropdown({
action: 'updateForm'
on: 'hover',
action: 'hide'
})
;
$hoverDropdown
$buttonDropdown
.dropdown({
on: 'hover'
action: 'hide'
})
;

68
src/modules/dropdown.js

@ -220,13 +220,6 @@ $.fn.dropdown = function(parameters) {
value = $choice.data(metadata.value) || text.toLowerCase()
;
if( $choice.find(selector.menu).size() === 0 ) {
module.verbose('Adding active state to selected item');
$item
.removeClass(className.active)
;
$choice
.addClass(className.active)
;
module.determine.selectAction(text, value);
$.proxy(settings.onChange, element)(value, text);
event.preventDefault();
@ -244,19 +237,9 @@ $.fn.dropdown = function(parameters) {
determine: {
selectAction: function(text, value) {
module.verbose('Determining action', settings.action);
if(settings.action == 'auto') {
if(module.is.selection()) {
module.debug('Selection dropdown used updating form', text, value);
module.updateForm(text, value);
}
else {
module.debug('No action specified hiding dropdown', text, value);
module.hide();
}
}
else if( $.isFunction( module[settings.action] ) ) {
if( $.isFunction( module.action[settings.action] ) ) {
module.verbose('Triggering preset action', settings.action, text, value);
module[ settings.action ](text, value);
module.action[ settings.action ](text, value);
}
else if( $.isFunction(settings.action) ) {
module.verbose('Triggering user action', settings.action, text, value);
@ -279,17 +262,44 @@ $.fn.dropdown = function(parameters) {
}
},
nothing: function() {},
action: {
changeText: function(text, value) {
module.set.text(text);
module.hide();
},
nothing: function() {},
hide: function() {
module.hide();
},
activate: function(text, value) {
value = value || text;
module.set.selected(value);
module.set.value(value);
module.hide();
},
/* Deprecated */
auto: function(text, value) {
value = value || text;
module.set.selected(value);
module.set.value(value);
module.hide();
},
/* Deprecated */
changeText: function(text, value) {
value = value || text;
module.set.selected(value);
module.hide();
},
/* Deprecated */
updateForm: function(text, value) {
value = value || text;
module.set.selected(value);
module.set.value(value);
module.hide();
}
updateForm: function(text, value) {
module.set.text(text);
module.set.value(value);
module.hide();
},
get: {
@ -748,7 +758,7 @@ $.fn.dropdown.settings = {
performance : true,
on : 'click',
action : 'auto',
action : 'activate',
delay: {
show: 200,

Loading…
Cancel
Save