formagic 0.3.4 → 0.3.7

data/app/assets/javascripts/formagic/inputs/password.coffee

@@ -1,32 +1,20 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # INPUT PASSWORD
 # -----------------------------------------------------------------------------
 class @InputPassword extends InputString
-
-  # PRIVATE ===============================================
+  # PRIVATE ===================================================================
 
   _add_input: ->
     @$input =$ "<input type='password' name='#{ @name }' value='#{ @value }' />"
     @$input.on 'keyup', (e) => @$input.trigger('change')
     @$el.append @$input
 
-
-  # PUBLIC ================================================
+  # PUBLIC ====================================================================
 
   updateValue: (@value) ->
     @$input.val(@value)
 
-
 chr.formInputs['password'] = InputPassword
-
-
-
-

data/app/assets/javascripts/formagic/inputs/redactor.coffee

@@ -1,32 +1,23 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # INPUT REDACTOR
 # -----------------------------------------------------------------------------
-#
 # Dependencies:
 #= require vendor/redactor.table
 #= require vendor/redactor.fixedtoolbar
 #= require ./redactor_character
 # -----------------------------------------------------------------------------
-
 class @InputRedactor extends InputString
-
-  # PRIVATE ===============================================
+  # PRIVATE ===================================================================
 
   _add_input: ->
     @$el.css('opacity', 0)
     @$input =$ "<textarea class='redactor' name='#{ @name }' rows=1>#{ @_safe_value() }</textarea>"
     @$el.append @$input
 
-
-  # PUBLIC ================================================
+  # PUBLIC ====================================================================
 
   initialize: ->
     @config.beforeInitialize?(this)
@@ -37,17 +28,10 @@ class @InputRedactor extends InputString
 
     @config.onInitialize?(this)
 
-
   updateValue: (@value) ->
     @_trigger_change = false
     @$input.redactor('code.set', @value)
 
-
 include(InputRedactor, redactorCharacter)
 
-
 chr.formInputs['redactor'] = InputRedactor
-
-
-
-

data/app/assets/javascripts/formagic/inputs/redactor_character.coffee

@@ -1,11 +1,6 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # REDACTOR CUSTOM VERSION
 #= require ./redactor_images
@@ -17,8 +12,7 @@ console.log ':: [redactor-character] change $.fx.speeds.fast from 200 to 10 ::'
 $.fx.speeds.fast = 10
 
 @redactorCharacter =
-
-  # PRIVATE ===============================================
+  # PRIVATE ===================================================================
 
   # TODO: fixed toolbar disabled on mobile
   _redactor_options: ->
@@ -41,7 +35,6 @@ $.fx.speeds.fast = 10
 
     return config
 
-
   _get_default_config: () ->
     focus:             false
     imageFloatMargin:  '20px'
@@ -70,8 +63,3 @@ $.fx.speeds.fast = 10
 
     initCallback: ->
       new RedactorImages(this)
-
-
-
-
-

data/app/assets/javascripts/formagic/inputs/redactor_images.coffee

@@ -1,15 +1,9 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # REDACTOR IMAGES
 # -----------------------------------------------------------------------------
-
 class @RedactorImages
   constructor: (@redactor) ->
 
@@ -41,7 +35,6 @@ class @RedactorImages
          <label class="redactor-image-link-option"><input type="checkbox" id="redactor-image-link-blank"> Open link in new tab</label>
        </section>"""
 
-
   update: ($image) ->
     @redactor.image.hideResize()
     @redactor.buffer.set()
@@ -85,7 +78,6 @@ class @RedactorImages
     @redactor.observe.images()
     @redactor.code.sync()
 
-
   _show_edit: ($image) ->
     $link = $image.closest('a')
 
@@ -126,7 +118,6 @@ class @RedactorImages
 
     @redactor.modal.show()
 
-
   # for some reason when image is a link, tooltip is shown with the image edit dialog,
   # add e.stopPropagation() to skip tooltip callback
   _load_editable_controls: ($image) ->
@@ -160,7 +151,3 @@ class @RedactorImages
       @redactor.image.editter.css('margin-left', '-' + editerWidth/2 + 'px')
 
     return @redactor.image.loadResizableControls($image, imageBox)
-
-
-
-

data/app/assets/javascripts/formagic/inputs/select.coffee

@@ -1,30 +1,21 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # INPUT SELECT
 # -----------------------------------------------------------------------------
-
 class @InputSelect extends InputString
-
-  # PRIVATE ===============================================
+  # PRIVATE ===================================================================
 
   _create_el: ->
     @$el =$ "<div class='form-input input-#{ @config.type } input-#{ @config.klassName }'>"
 
-
   _add_input: ->
     @$input =$ """<select name='#{ @name }'></select>"""
     @$el.append @$input
 
     @_add_options()
 
-
   _add_options: ->
     if @config.optionsHashFieldName
       @value = String(@value)
@@ -42,33 +33,28 @@ class @InputSelect extends InputString
     else if @config.optionsHash
       @_add_hash_options()
 
-
   _add_collection_options: ->
     for o in @config.collection.data
       title    = o[@config.collection.titleField]
       value    = o[@config.collection.valueField]
       @_add_option(title, value)
 
-
   _add_list_options: ->
     data = @config.optionsList
     for o in data
       @_add_option(o, o)
 
-
   _add_hash_options: ->
     data = @config.optionsHash
     for value, title of data
       @_add_option(title, value)
 
-
   _add_option: (title, value) ->
     selected = if @value == value then 'selected' else ''
     $option =$ """<option value='#{ value }' #{ selected }>#{ title }</option>"""
     @$input.append $option
 
-
-  # PUBLIC ================================================
+  # PUBLIC ====================================================================
 
   updateValue: (@value, @object) ->
     @$input.html('')
@@ -76,9 +62,4 @@ class @InputSelect extends InputString
 
     @$input.val(@value).prop('selected', true)
 
-
 chr.formInputs['select'] = InputSelect
-
-
-
-

data/app/assets/javascripts/formagic/inputs/select2.coffee

@@ -1,20 +1,12 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # INPUT SELECT 2
 # -----------------------------------------------------------------------------
-#
 # Dependencies:
 #= require vendor/select2
-#
 # -----------------------------------------------------------------------------
-
 class @InputSelect2 extends InputSelect
   initialize: ->
     @config.beforeInitialize?(this)
@@ -25,9 +17,4 @@ class @InputSelect2 extends InputSelect
 
     @config.onInitialize?(this)
 
-
 chr.formInputs['select2'] = InputSelect2
-
-
-
-

data/app/assets/javascripts/formagic/inputs/select2_multiple.coffee

@@ -0,0 +1,90 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+# -----------------------------------------------------------------------------
+# SELECT MULTIPLE
+# -----------------------------------------------------------------------------
+# Dependencies:
+#= require ./select2
+# -----------------------------------------------------------------------------
+class @InputSelect2Multiple extends InputSelect2
+  initialize: ->
+    @config.beforeInitialize?(this)
+
+    target = @config.target
+    titleFieldName = @config.titleField
+
+    # Remove name from the select input so it's value is not send to the server
+    @$input.attr('name', '').attr('multiple', true)
+
+    # Attach hidden input to store value
+    @$hiddenInput =$ "<input type='hidden' name='[__LIST__#{ target }]' />"
+    @$el.append @$hiddenInput
+
+    # Add handler that updates hidden value on select change (updated by select2)
+    @$input.on 'change', (e) =>
+      @_update_hidden_input_value()
+
+    # These methods run while initialization only
+    @_initialize_selected_values()
+    @_update_hidden_input_value()
+
+    options =
+      placeholder: @config.placeholder
+      multiple: true
+      width: '100%'
+      ajax:
+        url: @config.url
+        dataType: 'json'
+        delay: 250
+        cache: true
+        minimumInputLength: 2
+        data: (params) -> { search: params.term, page: 1, perPage: 20 }
+        processResults: (data, page) ->
+          { results: $.map data, (i) -> { id: i._id, text: i[titleFieldName] } }
+
+    # https://select2.github.io/options.html
+    $.extend(options, @config.pluginOptions || {})
+    @$input.select2(options)
+
+    @config.onInitialize?(this)
+
+# PRIVATE =====================================================================
+
+  _selected_ids: ->
+    $.map @$input.children(':selected'), (option) ->
+      $(option).attr('value')
+
+  _selected_ids_and_names: ->
+    $.map input.$input.children(':selected'), (option) ->
+      { _id: $(option).attr('value'), name: $(option).text() }
+
+  # Add initial values to be shown by select2
+  _initialize_selected_values: ->
+    titleFieldName = @config.titleField
+    for o in @value
+      @$input.append """
+        <option value='#{ o._id }' selected>
+          #{ o[titleFieldName] }
+        </option>"""
+
+  # Pass value to hidden input in list format (split ids with ,)
+  _update_hidden_input_value: ->
+    selectedValues = @_selected_ids()
+    val = selectedValues.join('|||')
+    @$hiddenInput.val(val)
+
+# PUBLIC ======================================================================
+
+  # Override default updateValue method
+  updateValue: (@value) ->
+    @$input.html('')
+    @_initialize_selected_values()
+    @_update_hidden_input_value()
+
+  # Override hash method to cache values properly
+  hash: (hash={}) ->
+    hash[@config.klassName] = @_selected_ids_and_names()
+    return hash
+
+chr.formInputs['selectMultiple'] = InputSelect2Multiple

data/app/assets/javascripts/formagic/inputs/select2_single.coffee

@@ -0,0 +1,57 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+# -----------------------------------------------------------------------------
+# SELECT SINGLE
+# -----------------------------------------------------------------------------
+# Dependencies:
+#= require ./select2
+# -----------------------------------------------------------------------------
+# Configuration example:
+#
+#   category_id:
+#     type: 'selectSingle'
+#     label: 'Category'
+#     titleField: 'title'
+#     url: "/admin/categories.json"
+#     relatedTitleField: 'category_title'
+# -----------------------------------------------------------------------------
+class @InputSelect2Multiple extends InputSelect2
+  initialize: ->
+    @config.beforeInitialize?(this)
+
+    titleFieldName = @config.titleField
+    @_initialize_options_hash(titleFieldName)
+
+    options =
+      placeholder: @config.placeholder
+      width: "100%"
+      ajax:
+        url: @config.url
+        dataType: 'json'
+        delay: 250
+        cache: true
+        minimumInputLength: 2
+        data: (params) -> { search: params.term, page: 1 }
+        processResults: (data, page) ->
+          { results: $.map data, (i) -> { id: i._id, text: i[titleFieldName] } }
+
+    # https://select2.github.io/options.html
+    $.extend(options, @config.pluginOptions || {})
+    @$input.select2(options)
+
+    @config.onInitialize?(this)
+
+  # PRIVATE ===================================================================
+
+  _initialize_options_hash: ->
+    @config.optionsHash = {}
+    if @object
+      relatedObjectId = @object[@config.fieldName]
+      relatedObjectTitle = @object[@config.relatedTitleField]
+      if ! relatedObjectTitle
+        relatedObjectTitle = 'None'
+      @config.optionsHash[relatedObjectId] = relatedObjectTitle
+    @_add_options()
+
+chr.formInputs['selectSingle'] = InputSelect2Multiple

data/app/assets/javascripts/formagic/inputs/string.coffee

@@ -1,11 +1,6 @@
 # -----------------------------------------------------------------------------
 # Author: Alexander Kravets <alex@slatestudio.com>,
 #         Slate Studio (http://www.slatestudio.com)
-#
-# Coding Guide:
-#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
-# -----------------------------------------------------------------------------
-
 # -----------------------------------------------------------------------------
 # INPUT STRING
 # -----------------------------------------------------------------------------
@@ -21,7 +16,6 @@
 #
 # Dependencies:
 #= require vendor/jquery.typeahead
-#
 # -----------------------------------------------------------------------------
 class @InputString
   constructor: (@name, @value, @config, @object) ->
@@ -35,8 +29,7 @@ class @InputString
 
     return this
 
-
-  # PRIVATE ===============================================
+  # PRIVATE ===================================================================
 
   _safe_value: ->
     if typeof(@value) == 'object'
@@ -44,26 +37,28 @@ class @InputString
     else
       return _escapeHtml(@value)
 
-
   _create_el: ->
     @$el =$ "<label for='#{ @name }' class='#{ @config.klass } input-#{ @config.type } input-#{ @config.klassName }'>"
 
-
   _add_label: ->
-    if @config.label != false
-      @$label        =$ "<span class='label'>#{ @config.label }</span>"
-      @$errorMessage =$ "<span class='error-message'></span>"
-      @$label.append(@$errorMessage)
-      @$el.append(@$label)
+    @$label =$ "<span class='label'>"
+    @$labelTitle =$ "<span class='label-title'>#{ @config.label }</span>"
+    @$errorMessage =$ "<span class='error-message'></span>"
+    @$label.append(@$labelTitle)
+    @$label.append(@$errorMessage)
+    @$el.append(@$label)
 
+    if @config.label == false
+      @$labelTitle.hide()
 
   _add_input: ->
-    @$input =$ "<input type='text' name='#{ @name }' value='#{ @_safe_value() }' />"
+    @$input =$ """
+      <input type='text' id='#{ @name }' name='#{ @name }' value='#{ @_safe_value() }' />
+    """
     # trigger change event on keyup so value is cached while typing
     @$input.on 'keyup', (e) => @$input.trigger('change')
     @$el.append @$input
 
-
     if @config.options and $.isArray(@config.options)
       data = new Bloodhound
         datumTokenizer: Bloodhound.tokenizers.obj.whitespace('value')
@@ -83,25 +78,21 @@ class @InputString
         source:     data.ttAdapter()
       })
 
-
   _add_placeholder: ->
     @$input.attr 'placeholder', @config.type
 
     if @config.placeholder
       @$input.attr 'placeholder', @config.placeholder
 
-
   _add_disabled: ->
     if @config.disabled
       @$input.prop('disabled', true)
       @$el.addClass('input-disabled')
 
-
   _add_required: ->
     if @config.required
       @$el.addClass('input-required')
 
-
   _add_limit: ->
     if @config.limit
       @$charCounter =$ "<span class='input-character-counter'></span>"
@@ -110,7 +101,6 @@ class @InputString
         @_update_character_counter()
       @_update_character_counter()
 
-
   _update_character_counter: ->
     characters = @$input.val().length
     left       = @config.limit - characters
@@ -121,40 +111,29 @@ class @InputString
     else
       @$charCounter.html("(#{ left })")
 
-
     if characters > @config.limit
       @$charCounter.addClass('exceeds')
     else
       @$charCounter.removeClass('exceeds')
 
-
-  # PUBLIC ================================================
+  # PUBLIC ====================================================================
 
   initialize: ->
     @config.onInitialize?(this)
 
-
   hash: (hash={}) ->
     hash[@config.klassName] = @$input.val()
     return hash
 
-
   updateValue: (@value) ->
     @$input.val(@value)
 
-
   showErrorMessage: (message) ->
     @$el.addClass('error')
     @$errorMessage.html(message)
 
-
   hideErrorMessage: ->
     @$el.removeClass('error')
     @$errorMessage.html('')
 
-
 chr.formInputs['string'] = InputString
-
-
-
-