binda 0.1.1 → 0.1.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (31) hide show
  1. checksums.yaml +4 -4
  2. data/README.md +3 -3
  3. data/app/assets/javascripts/binda/components/{form_item_choice.js → field_setting_choices.js} +13 -12
  4. data/app/assets/javascripts/binda/components/form_item_repeater.js +34 -30
  5. data/app/assets/javascripts/binda/components/login_form.js +15 -15
  6. data/app/assets/javascripts/binda/components/sortable.js +22 -20
  7. data/app/assets/javascripts/binda/dist/binda.bundle.js +154 -140
  8. data/app/assets/javascripts/binda/index.js +20 -20
  9. data/app/assets/stylesheets/binda/components/field_setting_choices.scss +90 -0
  10. data/app/assets/stylesheets/binda/components/form_item.scss +0 -50
  11. data/app/assets/stylesheets/binda/components/{form_item_choice.scss → form_item_choices.scss} +1 -7
  12. data/app/assets/stylesheets/binda/components/main_sortable_table.scss +68 -0
  13. data/app/assets/stylesheets/binda/components/main_table.scss +2 -5
  14. data/app/assets/stylesheets/binda/components/sortable.scss +1 -2
  15. data/app/assets/stylesheets/binda/components/standard-form.scss +5 -6
  16. data/app/assets/stylesheets/binda/index.scss +3 -1
  17. data/app/controllers/binda/field_groups_controller.rb +22 -75
  18. data/app/controllers/binda/manage/users_controller.rb +18 -13
  19. data/app/controllers/binda/structures_controller.rb +12 -11
  20. data/app/models/binda/choice.rb +10 -5
  21. data/app/models/binda/field_setting.rb +16 -6
  22. data/app/models/concerns/binda/fieldable_associations.rb +24 -12
  23. data/app/views/binda/components/sort_index.html.erb +21 -25
  24. data/app/views/binda/field_groups/_form_body.html.erb +5 -5
  25. data/app/views/binda/field_groups/_form_item_choice.erb +49 -66
  26. data/app/views/binda/structures/_form_section.html.erb +1 -1
  27. data/app/views/binda/structures/index.html.erb +2 -2
  28. data/app/views/binda/structures/sort_index.html.erb +28 -21
  29. data/config/locales/en.yml +7 -5
  30. data/lib/binda/version.rb +1 -1
  31. metadata +6 -4
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA1:
3
- metadata.gz: 5fdbd3a53b7c0c27db1b20d03b562cce049886ef
4
- data.tar.gz: d8678b7b7ee4a36804234f19f13abbaac7a38974
3
+ metadata.gz: 8a14502da9b61e81895cb12acda199217a9f8e17
4
+ data.tar.gz: d66be0ef4a7bb1546e2ec9490bf567692e297a66
5
5
  SHA512:
6
- metadata.gz: 82c4198e24a5d9cc12aaefbf713c870a7250a46ee7d5b7a8edca6d16617d6d8d6772574fada749b638d61ab6b6158f107e897e358a6f84146b48ccf2da7b94a7
7
- data.tar.gz: 81a8f0072979bfeb62d247240f4a258bc60f29cf247332b2a7b9334d918b0ec4793774240dc19edbb282a0f9c28992af6727005aba781a577663f9bf9f5d2893
6
+ metadata.gz: 63b76465c699918032cacfccc5a0dddd95ccfb3052528580747948bf47d84f3ac13ec0eda43a23bdc307936ab776670027e666150b07ab03759d7de0a3c8f50d
7
+ data.tar.gz: c074e52665ecb324967767c34def618217b978e66199cbcf9a64e71b9151212665d8a1f796c6a414a9ad454d0386c40a8a98417715bae884e65a2e2566b61f1c
data/README.md CHANGED
@@ -2,7 +2,6 @@
2
2
  A modular CMS for Ruby on Rails 5.1.
3
3
 
4
4
  [![Code Climate](https://codeclimate.com/github/lacolonia/binda/badges/gpa.svg)](https://codeclimate.com/github/lacolonia/binda)
5
- [![Issue Count](https://codeclimate.com/github/lacolonia/binda/badges/issue_count.svg)](https://codeclimate.com/github/lacolonia/binda)
6
5
  [![Build Status](https://travis-ci.org/a-barbieri/binda.svg?branch=master)](https://travis-ci.org/lacolonia/binda)
7
6
  [![Test Coverage](https://api.codeclimate.com/v1/badges/5dc62774a6b8b63aa72b/test_coverage)](https://codeclimate.com/github/lacolonia/binda/test_coverage)
8
7
  [![Dependency Status](https://gemnasium.com/badges/github.com/lacolonia/binda.svg)](https://gemnasium.com/github.com/lacolonia/binda)
@@ -25,9 +24,10 @@ Let's say your website needs a set of pages with a subtitle. That's super easy.
25
24
 
26
25
  - create a "Page" _structure_
27
26
  - go to General Details of "Page" _structure_ (see the small pencil icon)
28
- - set a "Subtitle" _field-settings_ based both on a _String_ field type.
27
+ - set a "Description" _field-settings_ based both on a _String_ field type.
28
+ - set a "Featured Image" _field-settings_ based both on a _Image_ field type.
29
29
 
30
- Done! Now you'll see the "Pages" tab in your menu which will contain all your pages.
30
+ Done! Now you'll see the "Pages" tab in your menu which will contain all your pages and where you can set the description and the featured image.
31
31
 
32
32
  It's easier learning by doing than by reading. ;-)
33
33
  Watch the preview on [Binda's vimeo channel](https://vimeo.com/bindacms/010-preview)
@@ -5,11 +5,11 @@
5
5
  import { _FormItemEditor } from './form_item_editor'
6
6
 
7
7
 
8
- class FormItemChoice {
8
+ class FieldSettingChoices {
9
9
 
10
10
  constructor()
11
11
  {
12
- this.target = '.form-item--choice'
12
+ this.target = '.field-setting-choices--choice'
13
13
  }
14
14
 
15
15
  isSet()
@@ -20,20 +20,20 @@ class FormItemChoice {
20
20
 
21
21
  setEvents()
22
22
  {
23
- $(document).on('click', '.form-item--add-choice', addChoice )
23
+ $(document).on('click', '.field-setting-choices--add-choice', addChoice )
24
24
 
25
- $(document).on('click', '.form-item--delete-choice', deleteChoice )
26
- $(document).on('click', '.form-item--js-delete-choice', function( event )
25
+ $(document).on('click', '.field-setting-choices--delete-choice', deleteChoice )
26
+ $(document).on('click', '.field-setting-choices--js-delete-choice', function( event )
27
27
  {
28
28
  event.preventDefault()
29
- $( this ).closest('.form-item--choice').remove()
29
+ $( this ).closest('.field-setting-choices--choice').remove()
30
30
  // Update form item editor size
31
31
  _FormItemEditor.resize()
32
32
  })
33
33
  }
34
34
  }
35
35
 
36
- export let _FormItemChoice = new FormItemChoice()
36
+ export let _FieldSettingChoices = new FieldSettingChoices()
37
37
 
38
38
 
39
39
  /**
@@ -44,10 +44,11 @@ function addChoice(event)
44
44
  {
45
45
  event.preventDefault()
46
46
  // Clone the new choice field
47
- var choices = $( this ).closest('.form-item--choices')
48
- var newchoice = choices.find('.form-item--new-choice')
49
- var clone = newchoice.clone().removeClass('form-item--new-choice').toggle()
50
- clone.find('.form-item--toggle-choice').toggle()
47
+ var choices_id = $( this ).data('choices-id')
48
+ var choices = $(`#${choices_id}`)
49
+ var newchoice = choices.find('.field-setting-choices--new-choice')
50
+ var clone = newchoice.clone().removeClass('field-setting-choices--new-choice').toggle()
51
+ clone.find('.field-setting-choices--toggle-choice').toggle()
51
52
  // Append the clone right after
52
53
  choices.prepend( clone )
53
54
  // Update form item editor size
@@ -59,7 +60,7 @@ function deleteChoice( event )
59
60
  {
60
61
  event.preventDefault()
61
62
 
62
- var choice = $( this ).closest('.form-item--choice')
63
+ var choice = $( this ).closest('.field-setting-choices--choice')
63
64
  var destination = $( this ).attr('href')
64
65
  var self = this
65
66
 
@@ -54,42 +54,46 @@ function addNewItem( event )
54
54
  // the code contained between the two SPLIT comments
55
55
  let parts = data.split('<!-- SPLIT -->')
56
56
  let newRepeater = parts[1]
57
+ setupAndAppend( newRepeater, $list )
58
+ })
59
+ }
57
60
 
58
- // Append the item
59
- $list.prepend( newRepeater )
60
- let new_repeater_item = $list.find('.form-item--repeater').get(0)
61
+ function setupAndAppend( newRepeater, $list )
62
+ {
63
+ // Append the item
64
+ $list.prepend( newRepeater )
65
+ let new_repeater_item = $list.find('.form-item--repeater').get(0)
61
66
 
62
- // Prepare animation
63
- new_repeater_item.style.maxHeight = 0
67
+ // Prepare animation
68
+ new_repeater_item.style.maxHeight = 0
64
69
 
65
- // Group fields if sotrable is enabled
66
- if ( $list.hasClass('sortable--enabled') )
70
+ // Group fields if sotrable is enabled
71
+ if ( $list.hasClass('sortable--enabled') )
72
+ {
73
+ $(new_repeater_item).find('.form-item--repeater-fields').each(function()
67
74
  {
68
- $(new_repeater_item).find('.form-item--repeater-fields').each(function()
69
- {
70
- this.style.maxHeight = 0 + 'px'
71
- })
72
- }
73
-
74
- // Setup TinyMCE for the newly created item
75
- var textarea_editor_id = $list.find('textarea').last('textarea').attr('id')
76
- tinyMCE.EditorManager.execCommand('mceAddEditor',true, textarea_editor_id);
77
-
78
- // Resize the editor (is it needed with the new configuration?)
79
- // _FormItemEditor.resize()
80
-
81
- // Update select input for Select2 plugin
82
- setupSelect2( $list.find('select') )
75
+ this.style.maxHeight = 0 + 'px'
76
+ })
77
+ }
83
78
 
84
- // Refresh Sortable to update the added item with Sortable features
85
- $list.sortable('refresh')
79
+ // Setup TinyMCE for the newly created item
80
+ var textarea_editor_id = $list.find('textarea').last('textarea').attr('id')
81
+ tinyMCE.EditorManager.execCommand('mceAddEditor',true, textarea_editor_id);
86
82
 
87
- // Run animation 50ms after previous style declaration (see above) otherwise animation doesn't get triggered
88
- setTimeout( function()
89
- {
90
- new_repeater_item.style.maxHeight = new_repeater_item.scrollHeight + 'px'
91
- }, 50)
92
- })
83
+ // Resize the editor (is it needed with the new configuration?)
84
+ // _FormItemEditor.resize()
85
+
86
+ // Update select input for Select2 plugin
87
+ setupSelect2( $list.find('select') )
88
+
89
+ // Refresh Sortable to update the added item with Sortable features
90
+ $list.sortable('refresh')
91
+
92
+ // Run animation 50ms after previous style declaration (see above) otherwise animation doesn't get triggered
93
+ setTimeout( function()
94
+ {
95
+ new_repeater_item.style.maxHeight = new_repeater_item.scrollHeight + 'px'
96
+ }, 50)
93
97
  }
94
98
 
95
99
  function deleteRepeter( event )
@@ -19,8 +19,8 @@ class LoginForm {
19
19
  else { return false }
20
20
  }
21
21
 
22
- setEvents ()
23
- {
22
+ init()
23
+ {
24
24
  this.$form = $('.login--form')
25
25
  this.$questions = $('ol.login--questions > li')
26
26
  this.questionsCount = this.$questions.length
@@ -30,13 +30,16 @@ class LoginForm {
30
30
  this.$questions.first().addClass('login--current')
31
31
 
32
32
  //disable form autocomplete
33
- this.$form.attr('autocomplete', 'off')
33
+ this.$form.attr('autocomplete', 'off')
34
+ this.setEvents()
35
+ }
34
36
 
37
+ setEvents()
38
+ {
35
39
  let self = this
36
-
37
40
 
38
41
  // first input
39
- let firstInput = this.$questions.get(this.current).querySelector( 'input, textarea, select' )
42
+ let firstInput = this.$questions.get(this.current).querySelector( 'input, textarea, select' )
40
43
 
41
44
  // focus
42
45
  let onFocusStart = function()
@@ -48,21 +51,21 @@ class LoginForm {
48
51
  firstInput.addEventListener('focus', onFocusStart )
49
52
 
50
53
  // show next question
51
- this.$nextButton.on('click', function( event )
52
- {
54
+ this.$nextButton.on('click', ( event )=>{
55
+
53
56
  event.preventDefault()
54
- self._nextQuestion()
57
+ this._nextQuestion()
55
58
  } )
56
59
 
57
60
  // pressing enter will jump to next question
58
- this.$form.on('keydown', function( event )
59
- {
61
+ this.$form.on('keydown', ( event )=>{
62
+
60
63
  let keyCode = event.keyCode || event.which
61
64
  // enter
62
65
  if( keyCode === 13 )
63
66
  {
64
67
  event.preventDefault()
65
- self._nextQuestion()
68
+ this._nextQuestion()
66
69
  }
67
70
  })
68
71
  }
@@ -70,10 +73,7 @@ class LoginForm {
70
73
  _nextQuestion()
71
74
  {
72
75
  // check if form is filled
73
- if( this.current === this.questionsCount - 1 )
74
- {
75
- this.isFilled = true
76
- }
76
+ if( this.current === this.questionsCount - 1 ) { this.isFilled = true }
77
77
 
78
78
  // current question
79
79
  let currentQuestion = this.$questions.get(this.current)
@@ -49,26 +49,7 @@ export default function()
49
49
 
50
50
  // Add event to any sortable toggle button
51
51
  // TODO: make this event available to element which aren't standard form repeaters
52
- $(document).on('click', '.standard-form--repeater .sortable--toggle', function( event )
53
- {
54
- event.preventDefault()
55
- let id = '#' + $( this ).data('repeater-id')
56
-
57
- if ( $( id ).hasClass('sortable--disabled') )
58
- {
59
- $( id ).sortable('enable')
60
- $( id ).find('.form-item--repeater-fields').each(close)
61
- $( id ).find('.form-item--collapsable').addClass('form-item--collapsed')
62
- }
63
- else
64
- {
65
- $( id ).sortable('disable')
66
- }
67
-
68
- $( id ).toggleClass('sortable--disabled')
69
- $( id ).toggleClass('sortable--enabled')
70
- $( this ).children('.sortable--toggle-text').toggle()
71
- })
52
+ $(document).on('click', '.standard-form--repeater .sortable--toggle', toggleSortable)
72
53
  }
73
54
 
74
55
 
@@ -90,4 +71,25 @@ function close()
90
71
  function open()
91
72
  {
92
73
  this.style.maxHeight = this.scrollHeight + "px";
74
+ }
75
+
76
+ function toggleSortable(event)
77
+ {
78
+ event.preventDefault()
79
+ let id = '#' + $( this ).data('repeater-id')
80
+
81
+ if ( $( id ).hasClass('sortable--disabled') )
82
+ {
83
+ $( id ).sortable('enable')
84
+ $( id ).find('.form-item--repeater-fields').each(close)
85
+ $( id ).find('.form-item--collapsable').addClass('form-item--collapsed')
86
+ }
87
+ else
88
+ {
89
+ $( id ).sortable('disable')
90
+ }
91
+
92
+ $( id ).toggleClass('sortable--disabled')
93
+ $( id ).toggleClass('sortable--enabled')
94
+ $( this ).children('.sortable--toggle-text').toggle()
93
95
  }