SHOW:
|
|
- or go back to the newest paste.
1 | ko.bindingHandlers.toggleSlide= { | |
2 | - | init: function(element, valueAccessor) { |
2 | + | init: function(element, valueAccessor, allBindings) { |
3 | - | // Initially set the element to be instantly visible/hidden depending on the value |
3 | + | var hiddenText = allBindings.get('toggleTextCollapsed'); |
4 | - | var value = valueAccessor(); |
4 | + | var visText = allBindings.get('toggleTextExpanded'); |
5 | - | $(element).toggleSlide(ko.unwrap(value)); // Use "unwrapObservable" so we can handle values that may or may not be observable |
5 | + | $(element).click(function() { |
6 | - | }, |
6 | + | if($(element).is(':visible')) { |
7 | - | update: function(element, valueAccessor) { |
7 | + | $(element).slideUp('fast'); |
8 | - | // Whenever the value subsequently changes, slowly fade the element in or out |
8 | + | if(togText) |
9 | - | var value = valueAccessor(); |
9 | + | $(element).text(hiddenText); |
10 | - | ko.unwrap(value) ? $(element).slideDown('fast') : $(element).slideUp('fast'); |
10 | + | } |
11 | else { | |
12 | $(element).slideDown('fast'); | |
13 | if(togText) | |
14 | $(element).text(visText); | |
15 | } | |
16 | }); | |
17 | } | |
18 | - | click: filteredPageChoices |
18 | + | |
19 | ||
20 | //////////////////////////////////////// | |
21 | ||
22 | - | then on the slide down element |
22 | + | |
23 | ||
24 | - | toggleSlide: filteredPageChoices |
24 | + | --NOTHING NEEDED-- |
25 | ||
26 | ////////////////////////////////////// | |
27 | ||
28 | ||
29 | data-bind="toggleSlide, toggleTextCollapsed: 'Show Choices', toggleTextExpanded: 'Hide Choices' |