formagic 0.1.0 → 0.2.5

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA1:
-  metadata.gz: eaeeb3489a798aafed4d51440ab9fb4d933f9f27
-  data.tar.gz: c0717929f3661809eeab159d8419b940d38eb5a4
+  metadata.gz: 5b03dc0a52060aac37925bb13cfb132af6073841
+  data.tar.gz: d7ca3659fc899e73a9eb3eb9c953d8195563c198
 SHA512:
-  metadata.gz: e41c4ae09383eed7c534784e4b8896e7938a3171c11dad5adbf282783cdec2089c798b8b1ca2816ec73ede8aade18c1973a055fbaf4790297538badf695ada8f
-  data.tar.gz: 0d8465bdc12df5d3d1e9d0e39cf57c10881552519899e0a8589cbf9bc1fb75b90dc8c1f2cbba7915b699e79350695f5dd750d48a784718db6aadf182db338f9d
+  metadata.gz: d262ebec3c701d80415a780eeda8b336584b5827d985977526fa021fd9e2e1308f9a86f7f412be5db4cf0ebc4ff831a5001134a23b8d8ca41afc7ca9891e5d33
+  data.tar.gz: b45ea0148e06c4fbb9d156898a0ed6a09758bda71185b061ed42949a4ba9bb93809f275457ecc74c3aa3a45038270069d11f85fc949b1d73eb9908e157374598

data/app/assets/javascripts/formagic/form.coffee

@@ -122,7 +122,7 @@ class @Form
     inputName = if @config.namePrefix then "#{ @config.namePrefix }[#{ name }]" else "[#{ name }]"
 
     # add prefix for nested form inputs
-    if inputConfig.type == 'form' || inputConfig.type == 'documents'
+    if inputConfig.type == 'form' || inputConfig.type == 'documents' || inputConfig.type == 'document'
       inputConfig.namePrefix = inputName.replace("[#{ name }]", "[#{ name }_attributes]")
 
     else
@@ -135,14 +135,20 @@ class @Form
 
   _add_nested_form_remove_button: ->
     if @config.removeButton
+
       # add hidden input to the form
-      fieldName          = '_destroy'
-      input              = @_render_input(fieldName, { type: 'hidden' }, false)
+      fieldName = '_destroy'
+      input     = @_render_input(fieldName, {
+        type:               'hidden',
+        ignoreOnSubmission: @config.ignoreOnSubmission
+      }, false)
+
       @inputs[fieldName] = input
-      @$el.append input.$el
+      @$el.prepend input.$el
+
       # remove button
       @$removeButton =$ """<a href='#' class='nested-form-delete'>Delete</a>"""
-      @$el.append @$removeButton
+      @$el.prepend @$removeButton
       @$removeButton.on 'click', (e) =>
         e.preventDefault()
         if confirm('Are you sure?')
@@ -181,13 +187,19 @@ class @Form
       for name, input of form.inputs
         if input.config.type == 'file' or input.config.type == 'image'
           file = input.$input.get()[0].files[0]
-          obj["__FILE__#{ input.name }"] = file
+
+          if file
+            obj["__FILE__#{ input.name }"] = file
+
           if input.isEmpty() then obj[input.removeName()] = 'true'
 
       # remove fields with ignoreOnSubmission
-      for name, input of form.inputs
+      for key, input of form.inputs
         if input.config.ignoreOnSubmission
-          delete obj[name]
+          delete obj[input.name]
+
+    # for k, v of obj
+    #   console.log k
 
     return obj
 
@@ -209,9 +221,17 @@ class @Form
   showValidationErrors: (errors) ->
     @hideValidationErrors()
     for inputName, messages of errors
-      input        = @inputs[inputName]
-      firstMessage = messages[0]
-      input.showErrorMessage(firstMessage)
+      input = @inputs[inputName]
+
+      # Support nested documents validation errors
+      if ! input
+        for k, v of @inputs
+          if v.name == "[#{ inputName }]"
+            input = v
+
+      if input
+        firstMessage = messages[0]
+        input.showErrorMessage(firstMessage)
 
 
   hideValidationErrors: ->

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

@@ -14,6 +14,7 @@ class @InputCheckbox extends InputString
     @_create_el()
     @_add_input()
     @_add_label()
+    @_add_disabled()
 
     return this
 

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

@@ -21,10 +21,17 @@ class @InputDate extends InputString
 
   _update_date_label: ->
     date = @$input.val()
-    date_formatted = moment(date).format("dddd, MMMM Do, YYYY")
+
+    if date
+      date_formatted = moment(date).format("dddd, MMMM Do, YYYY")
+
+    else
+      date_formatted = "<span class='placeholder'>Pick a date</span>"
+
     @$dateLabel.html(date_formatted)
 
 
+
   _add_input: ->
     @$input =$ "<input type='text' name='#{ @name }' value='#{ @_safe_value() }' class='input-datetime-date' />"
     @$el.append @$input
@@ -36,6 +43,25 @@ class @InputDate extends InputString
 
     @_update_date_label()
 
+    @_add_actions()
+
+
+  _add_actions: ->
+    @$actions =$ "<span class='input-actions'></span>"
+    @$label.append @$actions
+
+    @_add_remove_button()
+
+
+  _add_remove_button: ->
+    @$removeBtn =$ "<a href='#' class='remove'>Remove</a>"
+    @$actions.append @$removeBtn
+
+    @$removeBtn.on 'click', (e) =>
+      e.preventDefault()
+      @updateValue('')
+      @_update_date_label()
+
 
   # PUBLIC ================================================
 
@@ -58,8 +84,7 @@ class @InputDate extends InputString
 
   updateValue: (@value) ->
     @$input.val(@value)
-    # @TODO: check if required, cause change event might be triggered
-    #@_update_date_label()
+    @_update_date_label()
 
 
 chr.formInputs['date'] = InputDate

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

@@ -21,6 +21,11 @@ class @InputDatetime extends InputDate
 
   _update_value: ->
     mt = moment(@$inputTime.val(), 'LT')
+
+    if @$inputDate.val() == '' && ! mt.isValid()
+      @$input.val('')
+      return
+
     if ! mt.isValid()
       mt = moment('1:00 pm', 'LT')
 
@@ -44,7 +49,8 @@ class @InputDatetime extends InputDate
 
   _update_date_label: ->
     m = moment(@$inputDate.val()).utcOffset(@tzOffset)
-    @$dateLabel.html ( if m.isValid() then m.format('dddd, MMM D, YYYY') else 'Pick a date' )
+    label = if m.isValid() then m.format('dddd, MMM D, YYYY') else "<span class='placeholder'>Pick a date</span>"
+    @$dateLabel.html label
 
 
   _normalized_value: ->
@@ -52,7 +58,8 @@ class @InputDatetime extends InputDate
     @tzOffset  = @config.timezoneOffset
     @tzOffset ?= (new Date()).getTimezoneOffset() * -1
 
-    @value = moment(@value).utcOffset(@tzOffset).format()
+    m = moment(@value).utcOffset(@tzOffset)
+    @value = if m.isValid() then m.format() else ''
 
 
   _add_input: ->
@@ -88,6 +95,27 @@ class @InputDatetime extends InputDate
 
     @_update_time_input()
 
+    @_add_actions()
+
+
+  _add_actions: ->
+    @$actions =$ "<span class='input-actions'></span>"
+    @$label.append @$actions
+
+    @_add_remove_button()
+
+
+  _add_remove_button: ->
+    @$removeBtn =$ "<a href='#' class='remove'>Remove</a>"
+    @$actions.append @$removeBtn
+
+    @$removeBtn.on 'click', (e) =>
+      e.preventDefault()
+      @$inputTime.val('')
+      @$inputDate.val('')
+      @_update_date_label()
+      @_update_value()
+
 
   # PUBLIC ================================================
 

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

@@ -0,0 +1,110 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+#
+# Coding Guide:
+#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
+# -----------------------------------------------------------------------------
+
+# -----------------------------------------------------------------------------
+# INPUT DOCUMENT
+# -----------------------------------------------------------------------------
+# 1-to-1 relation implementation. This is based on InputDocuments
+# implementation and might require refactor.
+#
+# Public methods:
+#   initialize()
+#   hash(hash)
+#   updateValue(@value)
+#   showErrorMessage(message)
+#   hideErrorMessage()
+#
+# -----------------------------------------------------------------------------
+
+class @InputDocument
+  constructor: (@name, @nestedObject, @config, @object) ->
+    @forms = []
+
+    @config.namePrefix         ||= name
+    @config.removeButton         = true
+    @config.ignoreOnSubmission ||= false
+
+    if @config.ignoreOnSubmission
+      for key, inputConfig of @config.formSchema
+        inputConfig.ignoreOnSubmission = true
+
+    @_create_el()
+
+    @_add_label()
+    @_add_forms()
+
+    return this
+
+
+  # PRIVATE ===============================================
+
+  _create_el: ->
+    @$el =$ "<div class='input-stacked nested-forms input-#{ @config.klassName }'>"
+
+
+  _add_label: ->
+    @$label =$ "<span class='label'>#{ @config.label }</span>"
+    @$errorMessage =$ "<span class='error-message'></span>"
+    @$label.append(@$errorMessage)
+    @$el.append(@$label)
+
+
+  _add_forms: ->
+    @nestedForm = @_render_form(@nestedObject, @config.namePrefix, @config)
+
+    @$form = @nestedForm.$el
+    @$label.after @$form
+
+
+  _render_form: (object, namePrefix, config) ->
+    formConfig = $.extend {}, config,
+      namePrefix:   namePrefix
+      rootEl:       "<div>"
+      removeButton: false
+
+    form = new Form(object, formConfig)
+    return form
+
+
+  # PUBLIC ================================================
+
+  initialize: ->
+    @config.beforeInitialize?(this)
+
+    @nestedForm.initializePlugins()
+
+    @config.onInitialize?(this)
+
+
+  hash: (hash={}) ->
+    objects = []
+    hash[@config.fieldName] = @nestedForm.hash()
+    return hash
+
+
+  showErrorMessage: (message) ->
+    @$el.addClass 'error'
+    @$errorMessage.html(message)
+
+
+  hideErrorMessage: ->
+    @$el.removeClass 'error'
+    @$errorMessage.html('')
+
+
+  updateValue: (@nestedObject, @object) ->
+    for name, value of @nestedObject
+      if @nestedForm.inputs[name]
+        @nestedForm.inputs[name].updateValue(value, @object)
+
+
+chr.formInputs['document'] = InputDocument
+
+
+
+

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

@@ -28,11 +28,16 @@ class @InputForm
   constructor: (@name, @nestedObjects, @config, @object) ->
     @forms = []
 
-    @config.namePrefix   ||= name
-    @config.removeButton   = true
-    @config.formSchema._id = { type: 'hidden', name: 'id' }
+    @config.namePrefix         ||= name
+    @config.removeButton         = if @config.disableRemoveDocuments then false else true
+    @config.ignoreOnSubmission ||= false
+
     @reorderContainerClass = "nested-forms-#{@config.klassName}"
 
+    if @config.ignoreOnSubmission
+      for key, inputConfig of @config.formSchema
+        inputConfig.ignoreOnSubmission = true
+
     @_create_el()
 
     @_add_label()
@@ -55,7 +60,21 @@ class @InputForm
     @$el.append(@$label)
 
 
+  _extend_schema_with: (name, config) ->
+    schemaConfig = {}
+    schemaConfig[name] = config
+    @config.formSchema = $.extend(schemaConfig, @config.formSchema)
+
+
   _add_forms: ->
+    # add id to schema
+    # @NOTE: here we use _id, cause mongosteen returns objects _id, but we should send id for nested documents
+    @_extend_schema_with('_id', { type: 'hidden', name: 'id', ignoreOnSubmission: @config.ignoreOnSubmission })
+
+    # add position to schema
+    if @config.sortBy
+      @_extend_schema_with(@config.sortBy, { type: 'hidden', ignoreOnSubmission: @config.ignoreOnSubmission })
+
     @$forms =$ "<ul>"
     @$label.after @$forms
 
@@ -72,7 +91,6 @@ class @InputForm
 
   _sort_nested_objects: ->
     if @config.sortBy
-      @config.formSchema[@config.sortBy] = { type: 'hidden' }
       if @nestedObjects
         # this is not required but make things a bit easier on the backend
         # as object don't have to be in a specific order.
@@ -93,10 +111,13 @@ class @InputForm
 
 
   _add_new_button: ->
-    label = @config.newButtonLabel || "Add"
-    @$newButton =$ """<a href='#' class='nested-form-new'>#{ label }</a>"""
-    @$el.append @$newButton
-    @$newButton.on 'click', (e) => e.preventDefault() ; @addNewForm()
+    if ! @config.disableNewDocuments
+      label = @config.newButtonLabel || "Add"
+
+      @$newButton =$ """<a href='#' class='nested-form-new'>#{ label }</a>"""
+      @$el.append @$newButton
+
+      @$newButton.on 'click', (e) => e.preventDefault() ; @addNewForm()
 
 
   # PUBLIC ================================================
@@ -141,11 +162,8 @@ class @InputForm
       prevForm = _last(@forms)
       position = if prevForm then prevForm.inputs[@config.sortBy].value + 1 else 1
 
-      # @TODO: having an issue here for scenario when no nested object are there for new object
-      # form.inputs doesn't include sortBy field
-      console.log @config
-      console.log @config.sortBy
-      console.log form.inputs
+      # Had a problem here for new documents, but now seems to be resolved by adding
+      # _position to schema in constructor (to be removed when stable).
 
       form.inputs[@config.sortBy].updateValue(position)
 
@@ -157,10 +175,18 @@ class @InputForm
 
 
   updateValue: (@nestedObjects, @object) ->
+    # New document should update id, also after uploading images form for existing
+    # document might change, so we reset all nested forms to reflect these updates.
+    # This implementation has some problems with jumping screen when using plugins
+    # also it requires complex implementation for data local storage caching.
     @$forms.remove()
     @forms = []
     @_add_forms()
 
+    # Initialize input plugins after update
+    for nestedForm in @forms
+      nestedForm.initializePlugins()
+
 
 include(InputForm, inputFormReorder)
 

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

@@ -54,7 +54,7 @@
 
 
   _add_form_reorder_button: (form) ->
-    form.$el.append("""<div class='icon-reorder' data-container-class='#{@reorderContainerClass}'></div>""").addClass('reorderable')
+    form.$el.prepend("""<div class='icon-reorder' data-container-class='#{@reorderContainerClass}'></div>""").addClass('reorderable')
 
 
   _find_form_by_target: (el) ->

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

@@ -20,6 +20,7 @@ class @InputFile extends InputString
     @_add_input()
     @_update_state()
     @_add_required()
+    @_add_disabled()
 
     return this
 
@@ -82,8 +83,10 @@ class @InputFile extends InputString
     if @filename
       @$el.removeClass('empty')
       @_update_inputs()
+
     else
       @$el.addClass('empty')
+      @$clearButton.hide()
 
 
   # PUBLIC ================================================

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

@@ -50,6 +50,7 @@ class @InputHtml extends InputString
     @editor.$blockScrolling = Infinity
 
     @session = @editor.getSession()
+    @session.setUseWorker(false)
     @session.setValue(@$input.val())
     @session.setUseWrapMode(true)
     @session.setMode("ace/mode/html")

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

@@ -12,6 +12,7 @@
 #
 # Dependencies:
 #= require redactor
+#= require vendor/redactor.table
 #= require vendor/redactor.fixedtoolbar
 #= require ./redactor_character
 # -----------------------------------------------------------------------------

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

@@ -43,20 +43,22 @@ $.fx.speeds.fast = 10
 
 
   _get_default_config: () ->
-    focus:            false
-    imageFloatMargin: '20px'
-    buttonSource:     true
-    pastePlainText:   true
-    scrollTarget:     chr.module.view.$content
-    plugins:          []
-    buttons:          [ 'html',
-                        'formatting',
-                        'bold',
-                        'italic',
-                        'deleted',
-                        'unorderedlist',
-                        'orderedlist',
-                        'link' ]
+    focus:             false
+    imageFloatMargin:  '20px'
+    buttonSource:      true
+    pastePlainText:    true
+    replaceDivs:       false
+    scrollTarget:      chr.module.view.$content
+    plugins:           [ 'table' ]
+    buttons:           [ 'html'
+                         'formatting'
+                         'bold'
+                         'italic'
+                         'deleted'
+                         'unorderedlist'
+                         'orderedlist'
+                         'table'
+                         'link' ]
 
     # to have caching working we need to trigger 'change' event for textarea
     # when content got changed in redactor, but skip this when updating value

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

@@ -20,7 +20,7 @@ class @InputSelect2 extends InputSelect
     @config.beforeInitialize?(this)
 
     # https://select2.github.io/options.html
-    options = @config.pluginOptions || {}
+    options = @config.pluginOptions || { placeholder: @config.placeholder }
     @$input.select2(options)
 
     @config.onInitialize?(this)

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

@@ -50,10 +50,11 @@ class @InputString
 
 
   _add_label: ->
-    @$label        =$ "<span class='label'>#{ @config.label }</span>"
-    @$errorMessage =$ "<span class='error-message'></span>"
-    @$label.append(@$errorMessage)
-    @$el.append(@$label)
+    if @config.label != false
+      @$label        =$ "<span class='label'>#{ @config.label }</span>"
+      @$errorMessage =$ "<span class='error-message'></span>"
+      @$label.append(@$errorMessage)
+      @$el.append(@$label)
 
 
   _add_input: ->

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

@@ -36,8 +36,9 @@ class @InputText extends InputString
     @config.onInitialize?(this)
 
 
-chr.formInputs['text'] = InputText
-
-
+  updateValue: (@value) ->
+    @$input.val(@value)
+    @$input.trigger 'keyup'
 
 
+chr.formInputs['text'] = InputText

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

@@ -0,0 +1,37 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+#
+# Coding Guide:
+#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
+# -----------------------------------------------------------------------------
+
+# -----------------------------------------------------------------------------
+# INPUT URL
+# - depends on Loft character plugin for assets management
+# -----------------------------------------------------------------------------
+class @InputUrl extends InputString
+
+  _add_choose_button: ->
+    @$actions =$ "<span class='input-actions'></span>"
+    @$label.append @$actions
+
+    @$chooseBtn =$ "<a href='#' class='choose'>Choose or upload a file</a>"
+    @$actions.append @$chooseBtn
+
+    @$chooseBtn.on 'click', (e) =>
+      e.preventDefault()
+
+      chr.modules.loft.showModal 'all', false, (objects) =>
+        url = objects[0].file.url
+        @updateValue(url)
+
+
+  # PUBLIC ================================================
+
+  initialize: ->
+    @_add_choose_button()
+    @config.onInitialize?(this)
+
+
+chr.formInputs['url'] = InputUrl

data/app/assets/javascripts/formagic.coffee

@@ -19,4 +19,5 @@
 #= require ./formagic/inputs/redactor
 #= require ./formagic/inputs/select
 #= require ./formagic/inputs/select2
-#= require ./formagic/inputs/time
+#= require ./formagic/inputs/time
+#= require ./formagic/inputs/url