formagic 0.2.9 → 0.3.0
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/app/assets/javascripts/formagic/group.coffee +22 -0
- data/app/assets/javascripts/formagic/inputs/array.coffee +128 -0
- data/app/assets/javascripts/formagic/inputs/list.coffee +1 -4
- data/app/assets/javascripts/formagic.coffee +7 -4
- data/app/assets/stylesheets/formagic/array.scss +51 -0
- data/app/assets/stylesheets/formagic/nested-form.scss +7 -2
- data/app/assets/stylesheets/formagic/string.scss +4 -0
- data/app/assets/stylesheets/formagic/switch.scss +2 -1
- data/app/assets/stylesheets/formagic/text.scss +5 -4
- data/app/assets/stylesheets/formagic.scss +3 -3
- data/lib/formagic/version.rb +1 -1
- metadata +4 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA1:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 571f9dadd00731d428741b45677cc3e6d8f8afc6
|
|
4
|
+
data.tar.gz: e9133e7c8253186d6d4003a8d4e590fc278f9704
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: aecbde39dde0cd4b97b7c833731ca7d7ce4718ccd9a3d502db939587e3cd6bde5c7245e7d4c288800dc846f6f408154c439fef482d8ecbdaeb5ccc23ca7b883e
|
|
7
|
+
data.tar.gz: 42190bef935b4670c816914d12800b4d52e574957c567c13cbbd7fef0113fa9bb48d8dc9c4e42d723cd551a3df1b9fd91d888abed93c4c866b99b7f039c80f41
|
|
@@ -14,15 +14,37 @@
|
|
|
14
14
|
#
|
|
15
15
|
# -----------------------------------------------------------------------------
|
|
16
16
|
|
|
17
|
+
@_expandableGroupStateCache = {}
|
|
18
|
+
|
|
17
19
|
class @ExpandableGroup
|
|
18
20
|
constructor: (@form, @group, name) ->
|
|
19
21
|
@$expander =$ """<a href='#' class='group-edit hidden'>#{ name }</a>"""
|
|
20
22
|
@group.$el.before @$expander
|
|
21
23
|
|
|
24
|
+
@_restoreExpanderFromCache()
|
|
25
|
+
|
|
22
26
|
@$expander.on 'click', (e) =>
|
|
23
27
|
@$expander.toggleClass('hidden')
|
|
28
|
+
@_cacheExpanderState()
|
|
24
29
|
e.preventDefault()
|
|
25
30
|
|
|
26
31
|
|
|
32
|
+
_restoreExpanderFromCache: ->
|
|
33
|
+
if _expandableGroupStateCache.__hash
|
|
34
|
+
|
|
35
|
+
if _expandableGroupStateCache.__hash == window.location.hash
|
|
36
|
+
if _expandableGroupStateCache[@_groupId()]
|
|
37
|
+
@$expander.removeClass 'hidden'
|
|
38
|
+
|
|
39
|
+
if _expandableGroupStateCache.__hash.endsWith 'new'
|
|
40
|
+
@$expander.removeClass 'hidden'
|
|
41
|
+
|
|
42
|
+
|
|
43
|
+
_cacheExpanderState: ->
|
|
44
|
+
_expandableGroupStateCache.__hash = window.location.hash
|
|
45
|
+
_expandableGroupStateCache[@_groupId()] = @group.$el.is(':visible')
|
|
27
46
|
|
|
28
47
|
|
|
48
|
+
_groupId: ->
|
|
49
|
+
groupIndex = $('form').find(".group.#{ @group.klassName }").index(@group.$el)
|
|
50
|
+
return "#{ @group.klassName }-#{ groupIndex }"
|
|
@@ -0,0 +1,128 @@
|
|
|
1
|
+
# -----------------------------------------------------------------------------
|
|
2
|
+
# Author: Alexander Kravets <alex@slatestudio.com>,
|
|
3
|
+
# Slate Studio (http://www.slatestudio.com)
|
|
4
|
+
#
|
|
5
|
+
# Coding Guide:
|
|
6
|
+
# https://github.com/thoughtbot/guides/tree/master/style/coffeescript
|
|
7
|
+
# -----------------------------------------------------------------------------
|
|
8
|
+
|
|
9
|
+
# -----------------------------------------------------------------------------
|
|
10
|
+
# INPUT LIST
|
|
11
|
+
# -----------------------------------------------------------------------------
|
|
12
|
+
# Allows to create/delete/reorder list items connected to dynamic or static
|
|
13
|
+
# collection. Value should be an array of objects.
|
|
14
|
+
#
|
|
15
|
+
# All items should be unique for now.
|
|
16
|
+
#
|
|
17
|
+
# Dependencies:
|
|
18
|
+
#= require formagic/inputs/list_reorder
|
|
19
|
+
#
|
|
20
|
+
# -----------------------------------------------------------------------------
|
|
21
|
+
|
|
22
|
+
class @InputArray extends InputString
|
|
23
|
+
# PRIVATE ===============================================
|
|
24
|
+
|
|
25
|
+
_add_input: ->
|
|
26
|
+
# hidden input that stores ids, we use __LIST__ prefix to identify
|
|
27
|
+
# ARRAY input type and process it's value while form submission.
|
|
28
|
+
name = if @config.namePrefix then "#{ @config.namePrefix }[__LIST__#{ @config.klassName }]" else "[__LIST__#{ @config.klassName }]"
|
|
29
|
+
|
|
30
|
+
@$input =$ "<input type='hidden' name='#{ name }' value='' />"
|
|
31
|
+
@$el.append @$input
|
|
32
|
+
|
|
33
|
+
# list holder for items
|
|
34
|
+
@reorderContainerClass = @config.klassName
|
|
35
|
+
@$items =$ "<ul class='#{ @reorderContainerClass }'></ul>"
|
|
36
|
+
@$el.append @$items
|
|
37
|
+
|
|
38
|
+
@config.placeholder ||= 'Add new value'
|
|
39
|
+
@_create_string_input_el(@config.placeholder)
|
|
40
|
+
|
|
41
|
+
@_render_items()
|
|
42
|
+
@_update_input_value()
|
|
43
|
+
|
|
44
|
+
|
|
45
|
+
_values: ->
|
|
46
|
+
@$items.children('li').map((i, el) -> $(el).data('value')).get()
|
|
47
|
+
|
|
48
|
+
|
|
49
|
+
_update_input_value: ->
|
|
50
|
+
input_value = @_values().join('|||')
|
|
51
|
+
|
|
52
|
+
@$input.val(input_value)
|
|
53
|
+
@$input.trigger('change')
|
|
54
|
+
|
|
55
|
+
|
|
56
|
+
_remove_item: ($el) ->
|
|
57
|
+
$el.parent().remove()
|
|
58
|
+
@_update_input_value()
|
|
59
|
+
|
|
60
|
+
|
|
61
|
+
_render_items: ->
|
|
62
|
+
@$items.html('')
|
|
63
|
+
|
|
64
|
+
for v in @value
|
|
65
|
+
@_render_item(v)
|
|
66
|
+
|
|
67
|
+
|
|
68
|
+
_render_item: (o) ->
|
|
69
|
+
value = _escapeHtml(o)
|
|
70
|
+
|
|
71
|
+
listItem =$ """<li data-value='#{ value }'>
|
|
72
|
+
<span class='icon-reorder' data-container-class='#{ @reorderContainerClass }'></span>
|
|
73
|
+
#{ value }
|
|
74
|
+
<a href='#' class='action_remove'>Remove</a>
|
|
75
|
+
</li>"""
|
|
76
|
+
@$items.append(listItem)
|
|
77
|
+
|
|
78
|
+
@_update_input_value()
|
|
79
|
+
|
|
80
|
+
|
|
81
|
+
_create_string_input_el: (placeholder) ->
|
|
82
|
+
@$stringInput =$ "<input type='text' placeholder='#{ placeholder }' />"
|
|
83
|
+
@$el.append @$stringInput
|
|
84
|
+
|
|
85
|
+
|
|
86
|
+
_bind_string_input: ->
|
|
87
|
+
@$stringInput.on 'keyup', (e) =>
|
|
88
|
+
if e.keyCode == 13
|
|
89
|
+
val = $(e.currentTarget).val()
|
|
90
|
+
@_render_item(val)
|
|
91
|
+
$(e.currentTarget).val('')
|
|
92
|
+
|
|
93
|
+
|
|
94
|
+
# PUBLIC ================================================
|
|
95
|
+
|
|
96
|
+
initialize: ->
|
|
97
|
+
@config.beforeInitialize?(this)
|
|
98
|
+
|
|
99
|
+
# input for new values
|
|
100
|
+
@_bind_string_input()
|
|
101
|
+
|
|
102
|
+
# remove
|
|
103
|
+
@$items.on 'click', '.action_remove', (e) =>
|
|
104
|
+
e.preventDefault()
|
|
105
|
+
if confirm('Are you sure?') then @_remove_item($(e.currentTarget))
|
|
106
|
+
|
|
107
|
+
@_bind_reorder()
|
|
108
|
+
|
|
109
|
+
@config.onInitialize?(this)
|
|
110
|
+
|
|
111
|
+
|
|
112
|
+
updateValue: (@value) ->
|
|
113
|
+
@_render_items()
|
|
114
|
+
|
|
115
|
+
|
|
116
|
+
hash: (hash={}) ->
|
|
117
|
+
hash[@config.klassName] = @_values()
|
|
118
|
+
return hash
|
|
119
|
+
|
|
120
|
+
|
|
121
|
+
include(InputArray, inputListReorder)
|
|
122
|
+
|
|
123
|
+
|
|
124
|
+
chr.formInputs['array'] = InputArray
|
|
125
|
+
|
|
126
|
+
|
|
127
|
+
|
|
128
|
+
|
|
@@ -52,10 +52,7 @@ class @InputList extends InputString
|
|
|
52
52
|
ids = []
|
|
53
53
|
@$items.children('li').each (i, el) -> ids.push $(el).attr('data-id')
|
|
54
54
|
|
|
55
|
-
|
|
56
|
-
# it's used cause most cases list of IDs concidered to be here,
|
|
57
|
-
# we might make this a @config setting.
|
|
58
|
-
value = ids.join(',')
|
|
55
|
+
value = ids.join('|||')
|
|
59
56
|
|
|
60
57
|
@$input.val(value)
|
|
61
58
|
@$input.trigger('change')
|
|
@@ -11,13 +11,16 @@
|
|
|
11
11
|
#= require ./formagic/inputs/document
|
|
12
12
|
#= require ./formagic/inputs/documents
|
|
13
13
|
#= require ./formagic/inputs/file
|
|
14
|
-
#= require ./formagic/inputs/html
|
|
15
14
|
#= require ./formagic/inputs/image
|
|
16
15
|
#= require ./formagic/inputs/list
|
|
17
|
-
#= require ./formagic/inputs/markdown
|
|
18
16
|
#= require ./formagic/inputs/password
|
|
19
|
-
#= require ./formagic/inputs/redactor
|
|
20
17
|
#= require ./formagic/inputs/select
|
|
21
18
|
#= require ./formagic/inputs/select2
|
|
22
19
|
#= require ./formagic/inputs/time
|
|
23
|
-
#= require ./formagic/inputs/url
|
|
20
|
+
#= require ./formagic/inputs/url
|
|
21
|
+
#= require ./formagic/inputs/array
|
|
22
|
+
|
|
23
|
+
## OPTIONAL
|
|
24
|
+
# require ./formagic/inputs/redactor
|
|
25
|
+
# require ./formagic/inputs/html
|
|
26
|
+
# require ./formagic/inputs/markdown
|
|
@@ -0,0 +1,51 @@
|
|
|
1
|
+
/* Array Input -------------------------------------------- */
|
|
2
|
+
|
|
3
|
+
.input-array {
|
|
4
|
+
input {
|
|
5
|
+
padding-left : 2.5em;
|
|
6
|
+
margin-top : .25em;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
ul {
|
|
10
|
+
margin : 0 0 0 2.5em;
|
|
11
|
+
padding : 0;
|
|
12
|
+
list-style : none;
|
|
13
|
+
line-height : 1.5;
|
|
14
|
+
|
|
15
|
+
li {
|
|
16
|
+
@include user-select(none); position: relative;
|
|
17
|
+
|
|
18
|
+
a {
|
|
19
|
+
color : $formagic-assertive-color;
|
|
20
|
+
font-size : .75em;
|
|
21
|
+
&:hover {
|
|
22
|
+
opacity : .5;
|
|
23
|
+
}
|
|
24
|
+
}
|
|
25
|
+
}
|
|
26
|
+
}
|
|
27
|
+
|
|
28
|
+
.slip-reordering {
|
|
29
|
+
color : $formagic-positive-color;
|
|
30
|
+
}
|
|
31
|
+
|
|
32
|
+
.icon-reorder {
|
|
33
|
+
@include position(absolute);
|
|
34
|
+
left : -2.5em;
|
|
35
|
+
height : 1.5em;
|
|
36
|
+
&:before {
|
|
37
|
+
background-position : 10px 3px;
|
|
38
|
+
height : 1.5em;
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
// input:after {
|
|
43
|
+
// content: '+';
|
|
44
|
+
// display: block;
|
|
45
|
+
// width: 40px;
|
|
46
|
+
// height: 24px;
|
|
47
|
+
// position: absolute; left: 12px; top: -3px;
|
|
48
|
+
// font-size: 22px;
|
|
49
|
+
// color: $formagic-border-color;
|
|
50
|
+
// }
|
|
51
|
+
}
|
|
@@ -22,6 +22,7 @@
|
|
|
22
22
|
}
|
|
23
23
|
|
|
24
24
|
& > ul > li > .icon-reorder {
|
|
25
|
+
@include position(absolute);
|
|
25
26
|
z-index : 1;
|
|
26
27
|
left : 0;
|
|
27
28
|
top : 1em;
|
|
@@ -31,7 +32,7 @@
|
|
|
31
32
|
background-color : white;
|
|
32
33
|
|
|
33
34
|
& > .form-input:first-of-type {
|
|
34
|
-
padding-left : 2.
|
|
35
|
+
padding-left : 2.5em;
|
|
35
36
|
}
|
|
36
37
|
}
|
|
37
38
|
}
|
|
@@ -47,6 +48,10 @@
|
|
|
47
48
|
}
|
|
48
49
|
}
|
|
49
50
|
|
|
51
|
+
.nested-forms ul:empty + .nested-form-new {
|
|
52
|
+
margin-top : 0;
|
|
53
|
+
}
|
|
54
|
+
|
|
50
55
|
.nested-form-delete {
|
|
51
56
|
@include position(absolute, .35em .3em null null);
|
|
52
57
|
@include hide-text;
|
|
@@ -58,7 +63,7 @@
|
|
|
58
63
|
width : 1.5em;
|
|
59
64
|
|
|
60
65
|
&:before {
|
|
61
|
-
@include position(absolute, null
|
|
66
|
+
@include position(absolute, null .45em null null);
|
|
62
67
|
line-height : 1.35em;
|
|
63
68
|
content : '\00d7';
|
|
64
69
|
color : $formagic-label-color;
|
|
@@ -1,11 +1,11 @@
|
|
|
1
1
|
@import "normalize-rails";
|
|
2
2
|
|
|
3
|
-
$formagic-base-color :
|
|
3
|
+
$formagic-base-color : #333 !default;
|
|
4
4
|
$formagic-positive-color : rgb( 74,135,238) !default;
|
|
5
5
|
$formagic-assertive-color : rgb(239, 78, 58) !default;
|
|
6
6
|
$formagic-label-color : lighten($formagic-base-color, 25%);
|
|
7
7
|
$formagic-placeholder-color : rgb(210,210,210) !default;
|
|
8
|
-
$formagic-border-color :
|
|
8
|
+
$formagic-border-color : #eee !default;
|
|
9
9
|
|
|
10
10
|
@mixin custom-scrollbar($color, $bg-color, $radius) {
|
|
11
11
|
&::-webkit-scrollbar { width: 6px; background-color: $bg-color; }
|
|
@@ -71,7 +71,7 @@ $formagic-border-color : rgb(246,246,246) !default;
|
|
|
71
71
|
@import "formagic/string";
|
|
72
72
|
@import "formagic/switch";
|
|
73
73
|
@import "formagic/text";
|
|
74
|
-
|
|
74
|
+
@import "formagic/array";
|
|
75
75
|
|
|
76
76
|
|
|
77
77
|
|
data/lib/formagic/version.rb
CHANGED
metadata
CHANGED
|
@@ -1,14 +1,14 @@
|
|
|
1
1
|
--- !ruby/object:Gem::Specification
|
|
2
2
|
name: formagic
|
|
3
3
|
version: !ruby/object:Gem::Version
|
|
4
|
-
version: 0.
|
|
4
|
+
version: 0.3.0
|
|
5
5
|
platform: ruby
|
|
6
6
|
authors:
|
|
7
7
|
- Alexander Kravets
|
|
8
8
|
autorequire:
|
|
9
9
|
bindir: exe
|
|
10
10
|
cert_chain: []
|
|
11
|
-
date: 2015-
|
|
11
|
+
date: 2015-10-11 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: bourbon
|
|
@@ -91,6 +91,7 @@ files:
|
|
|
91
91
|
- app/assets/javascripts/formagic.coffee
|
|
92
92
|
- app/assets/javascripts/formagic/form.coffee
|
|
93
93
|
- app/assets/javascripts/formagic/group.coffee
|
|
94
|
+
- app/assets/javascripts/formagic/inputs/array.coffee
|
|
94
95
|
- app/assets/javascripts/formagic/inputs/checkbox.coffee
|
|
95
96
|
- app/assets/javascripts/formagic/inputs/color.coffee
|
|
96
97
|
- app/assets/javascripts/formagic/inputs/date.coffee
|
|
@@ -129,6 +130,7 @@ files:
|
|
|
129
130
|
- app/assets/javascripts/vendor/redactor.table.js
|
|
130
131
|
- app/assets/javascripts/vendor/select2.js
|
|
131
132
|
- app/assets/stylesheets/formagic.scss
|
|
133
|
+
- app/assets/stylesheets/formagic/array.scss
|
|
132
134
|
- app/assets/stylesheets/formagic/checkbox.scss
|
|
133
135
|
- app/assets/stylesheets/formagic/color.scss
|
|
134
136
|
- app/assets/stylesheets/formagic/date.scss
|