chr 0.1.4 → 0.1.5

data/app/assets/javascripts/chr.coffee

@@ -3,27 +3,28 @@
 #= require ./chr/vendor/jquery.typeahead
 #= require ./chr/vendor/slip
 
-#= require ./chr/core/_item
-#= require ./chr/core/_list
-#= require ./chr/core/_listSearch
-#= require ./chr/core/_listScroll
-#= require ./chr/core/_listReorder
-#= require ./chr/core/_view
-#= require ./chr/core/_module
+#= require ./chr/core/item
+#= require ./chr/core/list
+#= require ./chr/core/list-search
+#= require ./chr/core/list-scroll
+#= require ./chr/core/list-reorder
+#= require ./chr/core/view
+#= require ./chr/core/module
 
-#= require ./chr/form/_form
-#= require ./chr/form/_inputString
-#= require ./chr/form/_inputCheckbox
-#= require ./chr/form/_inputColor
-#= require ./chr/form/_inputFile
-#= require ./chr/form/_inputHidden
-#= require ./chr/form/_inputList
-#= require ./chr/form/_inputSelect
-#= require ./chr/form/_inputText
-#= require ./chr/form/_nestedForm
+#= require ./chr/form/form
+#= require ./chr/form/input-string
+#= require ./chr/form/input-checkbox
+#= require ./chr/form/input-color
+#= require ./chr/form/input-file
+#= require ./chr/form/input-hidden
+#= require ./chr/form/input-list
+#= require ./chr/form/input-select
+#= require ./chr/form/input-text
+#= require ./chr/form/nested-form
 
-#= require ./chr/store/_store
-#= require ./chr/store/_storeRails
+#= require ./chr/store/store
+#= require ./chr/store/store-rest
+#= require ./chr/store/store-mongosteen
 
-#= require ./chr/core/_utils
-#= require ./chr/core/_chr
+#= require ./chr/core/utils
+#= require ./chr/core/chr

data/app/assets/javascripts/chr/core/{_item.coffee → item.coffee}

@@ -76,8 +76,8 @@ class @Item
     @$el.remove()
 
   position: ->
-    fieldName = @config.arrayStore.sortBy
-    @object[fieldName]
+    positionFieldName = @config.arrayStore.sortBy
+    parseFloat(@object[positionFieldName])
 
 
 

data/app/assets/javascripts/chr/core/{_listReorder.coffee → list-reorder.coffee}

@@ -53,7 +53,7 @@
     objectPositionValue = _getObjectNewPosition(e.target)
     objectId = $(e.target).attr('data-id')
     value = {}
-    value["[#{arrayStore.sortBy}"] = objectPositionValue
+    value["[#{arrayStore.sortBy}"] = "#{ objectPositionValue }"
 
     arrayStore.update objectId, value,
       # NOTE: error handling

data/app/assets/javascripts/chr/core/{_listScroll.coffee → list-scroll.coffee}

@@ -15,7 +15,7 @@
       viewHeight           = $container.height()
 
       if listHeight < (viewHeight + e.target.scrollTop + 100)
-        listEl._loading -> arrayStore.fetchNextPage()
+        listEl._loading -> arrayStore.load()
 
 
 

data/app/assets/javascripts/chr/core/{_list.coffee → list.coffee}

@@ -116,6 +116,8 @@ class @List
     if @config.arrayStore  then @_bindConfigArrayStore()
     if @config.objectStore then @_bindConfigObjectStore()
 
+    @config.onListInit?(@)
+
   selectItem: (href) ->
     @$items.children("a[href='#{ href }']").addClass 'active'
 

data/app/assets/javascripts/chr/core/{_view.coffee → view.coffee}

@@ -100,8 +100,8 @@ class @View
 
   onSave: (e) ->
     e.preventDefault()
-    serializedObj = @form.serialize()
-    if @object then @_updateObject(serializedObj) else @_createObject(serializedObj)
+    serializedFormObj = @form.serialize()
+    if @object then @_updateObject(serializedFormObj) else @_createObject(serializedFormObj)
 
   onDelete: (e) ->
     e.preventDefault()

data/app/assets/javascripts/chr/store/store-mongosteen.coffee

@@ -0,0 +1,111 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+#
+# Coding Guide:
+#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
+# -----------------------------------------------------------------------------
+
+# -----------------------------------------------------------------------------
+# MONGOSTEEN (RAILS) ARRAY/COLLECTION STORE IMPLEMENTATION
+# -----------------------------------------------------------------------------
+class @MongosteenArrayStore extends RestArrayStore
+  # initial store configuration
+  _initialize_database: ->
+    @dataFetchLock = false
+    @ajaxConfig =
+      processData: false
+      contentType: false
+
+    @searchable   = @config.searchable ? false
+    @searchQuery  = ''
+
+    @pagination   = @config.pagination ? true
+    @pagesCounter = 0
+
+    # disable pagination when bootstraped data provided
+    if @config.data
+      @pagination = false
+
+
+  # generate resource api url
+  _resource_url: (type, id) ->
+    objectPath = if id then "/#{ id }" else ''
+    url = "#{ @config.path }#{ objectPath }.json"
+
+    if @config.urlParams
+      extraParamsString = $.param(@config.urlParams)
+      url = "#{ url }?#{ extraParamsString }"
+
+    return url
+
+
+  # get form data object from serialized form object,
+  # it uses special format for object names for support of:
+  # files, lists, nested objects
+  _parse_form_object: (serializedFormObject) ->
+    formDataObject = new FormData()
+
+    for attr_name, attr_value of serializedFormObject
+
+      # special case for LIST inputs, values separated with comma
+      if attr_name.indexOf('[__LIST__') > -1
+        attr_name = attr_name.replace('__LIST__', '')
+        values    = attr_value.split(',')
+
+        for value in values
+          formDataObject.append("#{ @config.resource }#{ attr_name }[]", value)
+
+      else
+        # special case for FILE inputs
+        if attr_name.startsWith('__FILE__')
+          attr_name = attr_name.replace('__FILE__', '')
+
+        formDataObject.append("#{ @config.resource }#{ attr_name }", attr_value)
+
+    return formDataObject
+
+
+  # load next page objects from database, when finished
+  # trigger 'objects_added' event
+  load: (success) ->
+    params = {}
+
+    if @pagination
+      params.page    = @pagesCounter + 1
+      params.perPage = _itemsPerPageRequest ? 20
+
+    if @searchable && @searchQuery.length > 0
+      params.search = @searchQuery
+
+    params = $.param(params)
+
+    @_ajax 'GET', null, params, ((dataObject) =>
+      if dataObject.length > 0
+        @pagesCounter = @pagesCounter + 1
+
+        for o in dataObject
+          @_add_data_object(o)
+
+      success?()
+      $(this).trigger('objects_added')
+    ) #, callbacks.onError
+
+
+  # load results for search query
+  search: (@searchQuery, callback) ->
+    @pagesCounter = 0
+    @_reset_data()
+    @load(callback)
+
+
+  # reset data and load first page
+  reset: (callback) ->
+    @searchQuery  = ''
+    @pagesCounter = 0
+    @_reset_data()
+    @load(callback)
+
+
+
+

data/app/assets/javascripts/chr/store/store-rest.coffee

@@ -0,0 +1,90 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+#
+# Coding Guide:
+#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
+# -----------------------------------------------------------------------------
+
+# -----------------------------------------------------------------------------
+# REST ARRAY STORE
+# -----------------------------------------------------------------------------
+class @RestArrayStore extends ArrayStore
+  # initial store configuration
+  _initialize_database: ->
+    @dataFetchLock = false
+    @ajaxConfig = {}
+
+
+  # generate rest url for resource
+  _resource_url: (type, id) ->
+    objectPath = if id then "/#{ id }" else ''
+    "#{ @config.path }#{ objectPath }"
+
+
+  # do requests to database api
+  _ajax: (type, id, data, success, error) ->
+    options = $.extend @ajaxConfig,
+      url:  @_resource_url(type, id)
+      type: type
+      data: data
+      success: (data, textStatus, jqXHR) =>
+        @dataFetchLock = false
+        success?(data)
+      error: (jqXHR, textStatus, errorThrown ) =>
+        @dataFetchLock = false
+        error?(jqXHR.responseJSON)
+
+    @dataFetchLock = true
+    $.ajax options
+
+
+  # load objects from database, when finished
+  # trigger 'objects_added' event
+  load: (success) ->
+    @_ajax 'GET', null, {}, ((dataObject) =>
+      if dataObject.length > 0
+        for o in dataObject
+          @_add_data_object(o)
+
+      success?()
+      $(this).trigger('objects_added')
+    ) #, callbacks.onError
+
+
+  # add new object
+  push: (serializedFormObject, callbacks) ->
+    obj = @_parse_form_object(serializedFormObject)
+
+    @_ajax 'POST', null, obj, ((dataObject) =>
+      if @newItemOnTop
+        @_add_data_object_on_top(dataObject, callbacks.onSuccess)
+      else
+        @_add_data_object(dataObject, callbacks.onSuccess)
+    ), callbacks.onError
+
+
+  # update objects attributes
+  update: (id, serializedFormObject, callbacks) ->
+    obj = @_parse_form_object(serializedFormObject)
+
+    @_ajax 'PUT', id, obj, ((dataObject) =>
+      @_update_data_object(id, dataObject, callbacks.onSuccess)
+    ), callbacks.onError
+
+
+  # delete object
+  remove: (id) ->
+    @_ajax 'DELETE', id, {}, ( =>
+      @_remove_data_object(id)
+    ), # callbacks.onError
+
+
+  # reset all data and load it again
+  reset: (callback) ->
+    @_reset_data()
+    @load(callback)
+
+
+
+

data/app/assets/javascripts/chr/store/store.coffee

@@ -0,0 +1,274 @@
+# -----------------------------------------------------------------------------
+# Author: Alexander Kravets <alex@slatestudio.com>,
+#         Slate Studio (http://www.slatestudio.com)
+#
+# Coding Guide:
+#   https://github.com/thoughtbot/guides/tree/master/style/coffeescript
+# -----------------------------------------------------------------------------
+
+# -----------------------------------------------------------------------------
+# OBJECT STORE
+# -----------------------------------------------------------------------------
+class @ObjectStore
+  constructor: (@config={}) ->
+    @_initialize_database()
+
+  _update_data_object: (value, callback) ->
+    callback?($.extend(@_data, value))
+
+  _fetch_data: ->
+    @_data = @config.data
+
+  _initialize_database: ->
+    @_fetch_data()
+
+  get: ->
+    @_data
+
+  update: (id, value, callback) ->
+    @_update_data_object(value, callback)
+
+
+# -----------------------------------------------------------------------------
+# ARRAY STORE
+# javascript object storage implementation that stores/loads objects in memory,
+# no backend database support here, supported features are:
+#   - new / update / remove
+#   - sorting
+#   - reordering
+#
+# configuration options:
+#   @config.data         — initial array of objects, default: []
+#   @config.sortBy       — objects field name which is used for sorting, does
+#                          not sort when parameter is not provided, default: nil
+#   @config.sortReverse  — reverse objects sorting (descending order),
+#                          default: false
+#   @config.newItemOnTop — add new item to the top of the list, default: true,
+#                          if @config.sortBy is not set, otherwise: false
+#   @config.reorderable  — list items reordering configuration hash, should
+#                          have two fields:
+#                            { positionFieldName: '',
+#                              sortReverse:       false }
+#
+# public methods:
+#   - on(eventType, callback)
+#   - off(eventType)
+#   - get(id)
+#   - push(serializedFormObject, callbacks)
+#   - update(serializedFormObject, callbacks)
+#   - remove(id)
+#   - reset(callback)
+#
+# todo:
+#   - support for lists, files, nested objects
+# -----------------------------------------------------------------------------
+class @ArrayStore
+  constructor: (@config={}) ->
+    @_map  = {} # objecs map for fast access by id
+    @_data = [] # stores objects in order
+
+    @sortBy      = @config.sortBy      ? false
+    @sortReverse = @config.sortReverse ? false
+    @reorderable = @config.reorderable ? false
+
+    if @sortBy == false
+      @newItemOnTop = @config.newItemOnTop ? true
+    else
+      @newItemOnTop = @config.newItemOnTop ? false
+
+    @_initialize_reorderable()
+    @_initialize_database()
+
+
+  # when store is reorderable update sorting configuration
+  _initialize_reorderable: ->
+    if @reorderable
+      if @reorderable.positionFieldName
+        @sortBy      = @reorderable.positionFieldName
+        @sortReverse = @reorderable.sortReverse ? false
+      else
+        console.log 'Wrong reordering configuration, missing positionFieldName parameter.'
+        @reorderable = false
+
+
+  # this method should be overriden for database initialization
+  # and config processing when implementing custom store
+  _initialize_database: ->
+    ;
+
+
+  # add objects from @config.data,
+  # trigger 'objects_added' event
+  _fetch_data: ->
+    if @config.data
+      @_add_data_object(o) for o in @config.data
+
+    $(this).trigger('objects_added')
+
+
+  # sort object in _data array based on sortBy and sortReverse parameters
+  # implementatin details:
+  #   http://stackoverflow.com/questions/9796764/how-do-i-sort-an-array-with-coffeescript
+  _sort_data: ->
+    if @sortBy
+      fieldName = @sortBy
+      direction = if @sortReverse then 1 else -1
+
+      sortByMethod = (key, a, b, dir) ->
+        if a[key] > b[key] then return -1*dir
+        if a[key] < b[key] then return +1*dir
+        return 0
+
+      @_data = @_data.sort (a, b) -> sortByMethod(fieldName, a, b, direction)
+
+
+  # gets objects position in _data array by objects id
+  _get_data_object_position: (id) ->
+    ids = []
+    for o in @_data
+      if o then ids.push(o._id)
+    $.inArray id, ids
+
+
+  # if objects id stored in id field, map it to _id as this is one
+  # which is used internally, this method might be more sophisticated
+  _normalize_object_id: (object) ->
+    if object.id
+      object._id = object.id
+      delete object.id
+    return object
+
+
+  # normalize objects id, add object to _data and _map, sort objects,
+  # trigger 'object_added' event
+  _add_data_object: (object, callback)->
+    object = @_normalize_object_id(object)
+
+    @_map[object._id] = object
+    @_data.push(object)
+
+    @_sort_data()
+    position = @_get_data_object_position(object._id)
+
+    $(this).trigger('object_added', { object: object, position: position, callback: callback })
+
+
+  # add object to the top of the _data neglecting ordering,
+  # trigger 'object_added' event
+  _add_data_object_on_top: (object, callback) ->
+    object = @_normalize_object_id(object)
+
+    @_map[object._id] = object
+    @_data.unshift(object)
+
+    position = 0
+
+    $(this).trigger('object_added', { object: object, position: position, callback: callback })
+
+
+  # get object by id, update it's attributes, sort objects,
+  # trigger 'object_changed' event
+  _update_data_object: (id, value, callback) ->
+    object = $.extend(@get(id), value)
+
+    @_sort_data()
+    position = @_get_data_object_position(id)
+
+    $(this).trigger('object_changed', { object: object, position: position, callback: callback })
+
+
+  # delete object by id from _data and _map,
+  # trigger 'object_removed' event
+  _remove_data_object: (id) ->
+    position = @_get_data_object_position(id)
+    if position >= 0
+      delete @_data[position]
+
+    delete @_map[id]
+
+    $(this).trigger('object_removed', { object_id: id })
+
+
+  # remove all objects from _data and _map,
+  # trigger 'object_removed' event for each
+  _reset_data: ->
+    for id, o of @_map
+      $(this).trigger('object_removed', { object_id: id })
+
+    @_map  = {}
+    @_data = []
+
+
+  # get regular javascript object from serialized form object,
+  # which uses special format for object names for support of:
+  # - files
+  # - lists
+  # - nested objects
+  _parse_form_object: (serializedFormObject) ->
+    # this is very basic and have to be expanded to support all form inputs:
+    #  - lists, files, nested objects
+    object = {}
+    for key, value of serializedFormObject
+      fieldName = key.replace('[', '').replace(']', '')
+      object[fieldName] = value
+    return object
+
+
+  # unsubscribe from store event, simple jQuery wrapper
+  off: (eventType) ->
+    if eventType then $(this).off(eventType) else $(this).off()
+
+
+  # subsribe to store event, subscribing to 'object_added' fetches data,
+  # available event types:
+  #  - object_added
+  #  - object_changed
+  #  - object_removed
+  #  - objects_added
+  on: (eventType, callback) ->
+    $(this).on eventType, (e, data) -> callback(e, data)
+
+    #! make sure this run only for first subscribe
+    if eventType == 'object_added'
+      @_fetch_data()
+
+
+  # get object by id
+  get: (id) ->
+    @_map[id]
+
+
+  # add new object
+  push: (serializedFormObject, callbacks) ->
+    object = @_parse_form_object(serializedFormObject)
+    if ! object._id then object._id = Date.now()
+
+    if @newItemOnTop
+      @_add_data_object_on_top(object, callbacks.onSuccess)
+    else
+      @_add_data_object(object, callbacks.onSuccess)
+
+
+  # update objects attributes
+  update: (id, serializedFormObject, callbacks) ->
+    object = @_parse_form_object(serializedFormObject)
+    @_update_data_object(id, object, callbacks.onSuccess)
+
+
+  # delete object
+  remove: (id) ->
+    @_remove_data_object(id)
+
+
+  # reset all data and load it again
+  reset: (callback) ->
+    # do nothing here as data is stored in memory, this method
+    # resets database data, syncing latest changes
+    @_sort_data()
+
+    $(this).trigger('objects_added')
+    callback?()
+
+
+
+