da-js 0.2.0 → 1.0.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- checksums.yaml +4 -4
- data/lib/assets/javascripts/da-js/conditional_visibility.js.coffee +38 -23
- data/lib/da-js/version.rb +1 -1
- metadata +1 -1
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA1:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 4030934aa9a7b6bf91ddbad0bc8802c261dbdade
|
4
|
+
data.tar.gz: 680b7b9e12660c9d6c08cdc2e11c4dca67bccb47
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: d8bb67a9d1a8454846f6a9826ba9b2a2a94c293cb7728d40c6f47e4c44404fd5ed0b6697544ef6cbfa35848a5042e5c00931998b9fc9a2def0e3077cbf235a0f
|
7
|
+
data.tar.gz: c36c3789e28637e8d6d4d1eee97104e73940716c1d3974ba48d510f648d62dcb22362595a2f7662529e2f216ca2aad809f5e647e651831b46a0158c1083a0f2f
|
@@ -1,18 +1,29 @@
|
|
1
|
-
# Hide/show elements dynamically according to their data-visible-if attribute.
|
1
|
+
# Hide/show elements dynamically according to their `data-visible-if` attribute.
|
2
2
|
#
|
3
|
-
# All elements with a data-visible-if attribute are checked on change, focusout and click events:
|
4
|
-
# For each element, the content of its data-visible-if attribute is eval'd. If the eval'd code
|
5
|
-
# (The
|
3
|
+
# All elements with a `data-visible-if` attribute are checked on change, focusout and click events:
|
4
|
+
# For each element, the content of its `data-visible-if` attribute is eval'd. If the eval'd code
|
5
|
+
# returns true, the element is shown – otherwise it is hidden. (The attribute must contain valid
|
6
|
+
# JavaScript code.)
|
6
7
|
#
|
7
|
-
#
|
8
|
+
# Use `$("body").conditionalVisibility()` to enable the functionality for the whole document,
|
9
|
+
# or use a more specific selector to enable it only for some elements.
|
10
|
+
#
|
11
|
+
# The following options can be specified when initializing the plugin:
|
8
12
|
#
|
9
|
-
#
|
13
|
+
# - `events`: The events which should trigger re-evaluation of visibilities (default:
|
14
|
+
# `"change focusout click"`)
|
10
15
|
#
|
11
|
-
#
|
16
|
+
# - `animate`: If elements should be shown/hidden using animations (default: `true`).
|
12
17
|
#
|
13
|
-
#
|
18
|
+
# There are two ways to manually force re-evaluation of visibilities:
|
19
|
+
#
|
20
|
+
# - `$(…).trigger("updateVisibilities")` updates visibilities (using animations) and then triggers
|
21
|
+
# `shown.conditionalVisibility` / `hidden.conditionalVisibility` events accordingly.
|
14
22
|
#
|
15
|
-
#
|
23
|
+
# - `$(…).trigger("setVisibilities")` sets visibilities directly (no animations, does not trigger
|
24
|
+
# custom events). This is already called automatically on pageready. You may want to call this
|
25
|
+
# manually after new elements have been added to the DOM (eg a modal with content fetched via
|
26
|
+
# ajax).
|
16
27
|
#
|
17
28
|
# Example:
|
18
29
|
#
|
@@ -21,32 +32,36 @@
|
|
21
32
|
# <input id="text" data-visible-if="$('#checkbox')[0].checked">
|
22
33
|
# </form>
|
23
34
|
# <script>
|
24
|
-
# $("#myform").conditionalVisibility()
|
35
|
+
# $("#myform").conditionalVisibility({events: "click change keypress"})
|
25
36
|
# </script>
|
26
37
|
|
27
38
|
$.fn.conditionalVisibility = (options = {}) ->
|
39
|
+
defaults =
|
40
|
+
animate: true
|
41
|
+
events: "change focusout click"
|
28
42
|
|
29
|
-
|
30
|
-
|
31
|
-
|
32
|
-
updateVisibilities = (event, options) ->
|
43
|
+
options = $.extend({}, defaults, options)
|
44
|
+
|
45
|
+
updateVisibilities = (event) ->
|
33
46
|
$(this).find("[data-visible-if]").each ->
|
34
47
|
$this = $(this)
|
35
48
|
if eval($this.data("visible-if"))
|
36
49
|
if $this.is(":hidden")
|
37
|
-
if options
|
38
|
-
$this.show()
|
39
|
-
else
|
40
|
-
$this.slideDown(100)
|
50
|
+
if options.animate then $this.slideDown(100) else $this.show()
|
41
51
|
$this.promise().done -> $this.trigger("shown.conditionalVisibility")
|
42
52
|
else
|
43
53
|
if $this.is(":visible")
|
44
|
-
if options
|
45
|
-
$this.hide()
|
46
|
-
else
|
47
|
-
$this.slideUp(100)
|
54
|
+
if options.animate then $this.slideUp(100) else $this.hide()
|
48
55
|
$this.promise().done -> $this.trigger("hidden.conditionalVisibility")
|
49
56
|
|
50
|
-
|
57
|
+
setVisibilities = (event) ->
|
58
|
+
$(this).find("[data-visible-if]").each ->
|
59
|
+
$this = $(this)
|
60
|
+
$this.toggle !!eval($this.data("visible-if"))
|
61
|
+
|
62
|
+
this
|
63
|
+
.on "#{options.events} updateVisibilities", updateVisibilities
|
64
|
+
.on "setVisibilities", setVisibilities
|
65
|
+
.trigger "setVisibilities"
|
51
66
|
|
52
67
|
|
data/lib/da-js/version.rb
CHANGED