locomotivecms 3.0.0.pre.alpha

data/app/assets/javascripts/locomotive/views/pages/edit_view.js.coffee

@@ -0,0 +1,48 @@
+#= require ../shared/form_view
+
+Locomotive.Views.Pages ||= {}
+
+class Locomotive.Views.Pages.EditView extends Locomotive.Views.Shared.FormView
+
+  el: '.main'
+
+# Locomotive.Views.Pages ||= {}
+
+# class Locomotive.Views.Pages.EditView extends Locomotive.Views.Pages.FormView
+
+#   save: (event) ->
+#     event.stopPropagation() & event.preventDefault()
+
+#     @trigger_change_event_on_focused_inputs()
+
+#     form = $(event.target).trigger('ajax:beforeSend')
+
+#     @clear_errors()
+
+#     # store the previous editable elements in case we
+#     # need to use the content of these elements for
+#     # the new ones (same block and slug).
+#     editable_elements = _.clone @model.get('editable_elements')
+
+#     @model.save {},
+#       success: (model, response) =>
+#         form.trigger('ajax:complete')
+
+#         model._normalize()
+
+#         if model.get('template_changed') == true
+#           model.get('editable_elements').update_content_from(editable_elements)
+#           @reset_editable_elements()
+#         else
+#           @refresh_editable_elements()
+
+#         # refresh the show link
+#         fullpath = @model.get('localized_fullpaths')[window.content_locale]
+#         @$('#local-actions-bar > a.show').attr('href', "/#{fullpath}")
+
+#       error: (model, xhr) =>
+#         form.trigger('ajax:complete')
+
+#         errors = JSON.parse(xhr.responseText)
+
+#         @show_errors errors

data/app/assets/javascripts/locomotive/views/pages/index_view.js.coffee

@@ -0,0 +1,11 @@
+# Locomotive.Views.Pages ||= {}
+
+# class Locomotive.Views.Pages.IndexView extends Backbone.View
+
+#   el: '#content'
+
+#   render: ->
+#     @index_view = new Locomotive.Views.Pages.ListView()
+#     @index_view.render()
+
+#     return @

data/app/assets/javascripts/locomotive/views/pages/list_view.js.coffee

@@ -0,0 +1,79 @@
+Locomotive.Views.Pages ||= {}
+
+class Locomotive.Views.Pages.ListView extends Backbone.View
+
+  el: '.pages-tree'
+
+  render: ->
+    @make_foldable()
+
+    @make_sortable()
+
+    @make_hoverable()
+
+    return @
+
+  make_foldable: ->
+    self = @
+
+    @$('ul .fold-unfold').each ->
+      $toggler  = $(this)
+      $children = $toggler.next('ul.leaves')
+
+      # hide the folded nodes at startup
+      $children.hide() if $toggler.hasClass('folded')
+
+    .click (event) ->
+      $toggler  = $(this)
+      $node     = $toggler.parents('li.node')
+      $children = $toggler.next('ul.leaves')
+
+      if $toggler.hasClass('folded')
+        $children.slideDown 'fast', ->
+          $toggler.removeClass('folded').addClass('unfolded')
+          $.cookie($node.attr('id'), 'unfolded', { path: window.Locomotive.mounted_on })
+      else
+        $children.slideUp 'fast', ->
+          $toggler.removeClass('unfolded').addClass('folded')
+          $.cookie($node.attr('id'), 'folded', { path: window.Locomotive.mounted_on })
+
+  make_sortable: ->
+    self = @
+
+    @$('ul').sortable
+      items:        '> li.page'
+      handle:       '.draggable'
+      axis:         'y'
+      placeholder:  'sortable-placeholder'
+      cursor:       'move'
+      update: (event, ui)  ->
+        self.call_sort $(@)
+      stop: (event, ui) ->
+        if $(@).hasClass('root')
+          position = ui.item.index()
+          $(@).sortable('cancel') if position == 0 || position >= $(@).find('> li').size() - 2
+
+  make_hoverable: ->
+    @$('a').hover ->
+      $(@).prev('i.icon').addClass('on')
+    , -> $(@).prev('i.icon').removeClass('on')
+
+  call_sort: (folder) ->
+    $.rails.ajax
+      url:        folder.data('url')
+      type:       'post'
+      dataType:   'json'
+      data:
+        children: (_.map folder.sortable('toArray'), (el) -> el.replace('node-', ''))
+        _method:  'put'
+      success:    @.on_successful_sort
+      error:      @.on_failed_sort
+
+  on_successful_sort: (data, status, xhr) ->
+    $.growl decodeURIComponent($.parseJSON(xhr.getResponseHeader('X-Message'))),
+      type: 'success'
+
+  on_failed_sort: (data, status, xhr) ->
+    $.growl decodeURIComponent($.parseJSON(xhr.getResponseHeader('X-Message'))),
+      type: 'error'
+

data/app/assets/javascripts/locomotive/views/pages/new_view.js.coffee

@@ -0,0 +1,8 @@
+# Locomotive.Views.Pages ||= {}
+
+# class Locomotive.Views.Pages.NewView extends Locomotive.Views.Pages.FormView
+
+#   save: (event) ->
+#     @save_in_ajax event,
+#       on_success: (response, xhr) ->
+#         window.location.href = xhr.getResponseHeader('location')

data/app/assets/javascripts/locomotive/views/shared/drawer_view.js.coffee

@@ -0,0 +1,82 @@
+Locomotive.Views.Shared ||= {}
+
+class Locomotive.Views.Shared.DrawerView extends Backbone.View
+
+  el: 'section.drawer'
+
+  delays:
+    fade:   50 # see the _transitions.css.scss file
+    remove: 200
+
+  events:
+    'click .close-button': 'close'
+
+  initialize: ->
+    @stack = []
+    super
+
+  open: (url, view_klass, options = {}) ->
+    console.log "[DrawerView] open, stack(#{@stack.length}) opened = #{$('body').hasClass('drawer-opened')}, #{url}"
+    entry = { url: url, view_klass: view_klass, options: options }
+    @push(entry)
+
+  close: ->
+    console.log "[DrawerView] close, stack(#{@stack.length})"
+    @pop()
+
+  push: (entry) ->
+    @hide(@last_entry())
+    @stack.push(entry)
+    @show(entry)
+
+  pop: ->
+    entry = @stack.pop(entry)
+    @hide entry, => @show(@last_entry())
+
+  show: (entry) ->
+    return if entry == null
+
+    # if first time the drawer is opened, we do not need to wait
+    # for the fading out of the previous screen
+    timeout = if @stack.length == 1 then 0 else @delays.fade
+
+    setTimeout =>
+      _container  = @container()
+      if entry.url?
+        _container.load entry.url, =>
+          @_show(entry, _container)
+      else
+        @_show(entry, _container)
+    , timeout
+
+  hide: (entry, callback) ->
+    return if entry == null
+
+    if @stack.length == 0
+      $('body').removeClass('drawer-opened')
+    else
+      entry.view.$el.addClass('fadeout')
+
+    setTimeout =>
+      entry.view.hide_from_drawer(@stack.length) if entry.view.hide_from_drawer?
+      entry.view.remove()
+      callback() if callback?
+    , @delays.remove
+
+  last_entry: ->
+    if @stack.length == 0
+      null
+    else
+      @stack[@stack.length - 1]
+
+  container: ->
+    @$('> .inner').html('<div></div>').find('> div')
+
+  _show: (entry, container) ->
+    _klass      = entry.view_klass
+    attributes  = _.extend { el: container, drawer: @ }, entry.options
+
+    entry.view = new _klass(attributes)
+    entry.view.render()
+
+    $('body').addClass('drawer-opened')

data/app/assets/javascripts/locomotive/views/shared/form_view.js.coffee

@@ -0,0 +1,251 @@
+Locomotive.Views.Shared ||= {}
+
+class Locomotive.Views.Shared.FormView extends Backbone.View
+
+  el: '.main'
+
+  namespace: null
+
+  inputs: []
+
+  events:
+    'submit form': 'save'
+
+  render: ->
+    @display_active_nav()
+
+    @enable_file_inputs()
+    @enable_array_inputs()
+    @enable_toggle_inputs()
+    @enable_date_inputs()
+    @enable_datetime_inputs()
+    @enable_rte_inputs()
+    @enable_tags_inputs()
+    @enable_document_picker_inputs()
+
+    # make title editable (if possible)
+    # @make_title_editable()
+
+    # @_hide_last_separator()
+
+    # make inputs foldable (if specified)
+    # @make_inputs_foldable()
+
+    # TODO: allow users to save with CTRL+S or CMD+s
+    # @enable_save_with_keys_combination()
+
+    # enable form notifications
+    # @enable_form_notifications()
+
+    return @
+
+  display_active_nav: ->
+    url = document.location.toString()
+    if url.match('#')
+      name = url.split('#')[1]
+      @$(".nav-tabs a[href='##{name}']").tab('show')
+
+  record_active_tab: ->
+    tab_name = $('form .nav-tabs li.active a').attr('href').replace('#', '')
+    @$('#active_tab').val(tab_name)
+
+  change_state: ->
+    @$('form button[type=submit]').button('loading')
+
+  save: (event) ->
+    @change_state()
+    @record_active_tab()
+
+  enable_file_inputs: ->
+    self = @
+    @$('.input.file').each ->
+      view = new Locomotive.Views.Inputs.FileView(el: $(@))
+      view.render()
+      self.inputs.push(view)
+
+  enable_array_inputs: ->
+    self = @
+    @$('.input.array').each ->
+      view = new Locomotive.Views.Inputs.ArrayView(el: $(@))
+      view.render()
+      self.inputs.push(view)
+
+  enable_toggle_inputs: ->
+    @$('.input.toggle input[type=checkbox]').each ->
+      $toggle = $(@)
+      $toggle.data('label-text', (if $toggle.is(':checked') then $toggle.data('off-text') else $toggle.data('on-text')))
+      $toggle.bootstrapSwitch
+        onSwitchChange: (event, state) ->
+          $toggle.data('bootstrap-switch').labelText((if state then $toggle.data('off-text') else $toggle.data('on-text')))
+
+  enable_date_inputs: ->
+    @$('.input.date input[type=text]').each ->
+      $(@).datetimepicker
+        language: window.content_locale
+        pickTime: false
+        widgetParent: '.main'
+        format: $(@).data('format')
+
+  enable_datetime_inputs: ->
+    @$('.input.date-time input[type=text]').each ->
+      $(@).datetimepicker
+        language: window.content_locale
+        pickTime: true
+        widgetParent: '.main'
+        use24hours: true
+        useseconds: false
+        format: $(@).data('format')
+
+  enable_rte_inputs: ->
+    self = @
+    @$('.input.rte').each ->
+      view = new Locomotive.Views.Inputs.RteView(el: $(@))
+      view.render()
+      self.inputs.push(view)
+
+  enable_tags_inputs: ->
+    @$('.input.tags input[type=text]').tagsinput()
+
+  enable_document_picker_inputs: ->
+    self = @
+    @$('.input.document_picker').each ->
+      view = new Locomotive.Views.Inputs.DocumentPickerView(el: $(@))
+      view.render()
+      self.inputs.push(view)
+
+  remove: ->
+    self.inputs.each (view) -> view.remove()
+    @$('.input.tags input[type=text').tagsinput('destroy')
+
+  _stop_event: (event) ->
+    event.stopPropagation() & event.preventDefault()
+
+
+  # ===============================
+
+  # save: (event) ->
+  #   alert('foo')
+  #   by default, follow the default behaviour
+
+  # save_in_ajax: (event, options) ->
+  #   event.stopPropagation() & event.preventDefault()
+
+  #   @trigger_change_event_on_focused_inputs()
+
+  #   form = $(event.target).trigger('ajax:beforeSend')
+
+  #   @clear_errors()
+
+  #   options ||= { headers: {}, on_success: null, on_error: null }
+
+  #   previous_attributes = _.clone @model.attributes
+
+  #   xhr = @model.save {},
+  #     headers:  options.headers
+  #     silent:   true # since we pass an empty hash above, no need to trigger the callbacks
+
+  #   xhr.success (model, response, _options) =>
+  #     form.trigger('ajax:complete')
+
+  #     @model.set(previous_attributes)
+  #     model.attributes = previous_attributes
+
+  #     options.on_success(model, xhr) if options.on_success
+
+  #   xhr.error (model, xhr) =>
+  #     form.trigger('ajax:complete')
+
+  #     errors = JSON.parse(model.responseText)
+
+  #     @show_errors errors
+
+  #     options.on_error() if options.on_error
+
+  # make_title_editable: ->
+  #   title = @$('h2 a.editable')
+
+  #   if title.size() > 0
+  #     target = @$("##{title.attr('rel')}")
+  #     target.parent().hide()
+
+  #     title.click (event) =>
+  #       event.stopPropagation() & event.preventDefault()
+  #       newValue = prompt(title.attr('title'), title.html());
+  #       if newValue && newValue != ''
+  #         title.html(newValue)
+  #         target.val(newValue).trigger('change')
+
+  # make_inputs_foldable: ->
+  #   self = @
+  #   @$('.formtastic fieldset.foldable.folded ol').hide()
+  #   @$('.formtastic fieldset.foldable legend').click ->
+  #     parent  = $(@).parent()
+  #     content = $(@).next()
+
+  #     if parent.hasClass 'folded'
+  #       parent.removeClass 'folded'
+  #       content.slideDown 100, -> self.after_inputs_fold(parent)
+  #     else
+  #       content.slideUp 100, -> parent.addClass('folded')
+
+  # trigger_change_event_on_focused_inputs: ->
+  #   # make sure that the current text field gets saved too
+  #   input = @$('form input[type=text]:focus, form input[type=password]:focus, form input[type=number]:focus, form textarea:focus')
+  #   input.trigger('change') if input.size() > 0
+
+  # enable_save_with_keys_combination: ->
+  #   $.cmd 'S', (() =>
+  #     @$('form input[type=submit]').trigger('click')
+  #   ), [], ignoreCase: true
+
+  # enable_form_notifications: ->
+  #   @$('form').formSubmitNotification()
+
+  # after_inputs_fold: ->
+  #   # overide this method if necessary
+
+  # clear_errors: ->
+  #   @$('.inline-errors').remove()
+
+  # show_errors: (errors) ->
+  #   for attribute, message of errors
+  #     if _.isString(message[0])
+  #       html = $("<div class=\"inline-errors\"><p>#{message[0]}</p></div>")
+  #       @show_error attribute, message[0], html
+  #     else
+  #       @show_error attribute, message
+
+  # show_error: (attribute, message, html) ->
+  #   prefix = if @namespace? then "#{@namespace}_" else ''
+
+  #   input = @$("##{prefix}#{@model.paramRoot}_#{attribute}")
+  #   input = @$("##{prefix}#{@model.paramRoot}_#{attribute}_id") if input.size() == 0
+  #   input = @$("##{prefix}#{@model.paramRoot}_#{attribute}_ids") if input.size() == 0
+
+  #   return unless input.size() > 0
+
+  #   anchor = input.parent().find('.error-anchor')
+  #   anchor = input if anchor.size() == 0
+  #   anchor.after(html)
+
+  # _enable_checkbox: (name, options) ->
+  #   options     ||= {}
+  #   model_name  = options.model_name || @model.paramRoot
+
+  #   @$("li##{model_name}_#{name}_input input[type=checkbox]").checkToggle
+  #     on_callback: =>
+  #       _.each options.features, (exp) -> @$("li##{model_name}_#{exp}_input").hide()
+  #       options.on_callback() if options.on_callback?
+  #       @_hide_last_separator()
+  #     off_callback: =>
+  #       _.each options.features, (exp) -> @$("li##{model_name}_#{exp}_input").show()
+  #       options.off_callback() if options.off_callback?
+  #       @_hide_last_separator()
+
+  # _hide_last_separator: ->
+  #   _.each @$('fieldset'), (fieldset) =>
+  #     $(fieldset).find('li.last').removeClass('last')
+  #     $(_.last($(fieldset).find('li.input:visible'))).addClass('last')
+
+  # enable_form_notifications: ->
+  #   @$('form').formSubmitNotification()