locomotivecms 3.0.0.pre.alpha.2 → 3.0.0.pre.alpha.3

data/app/assets/javascripts/locomotive/views/inputs/rte/file_view.js.coffee

@@ -9,11 +9,13 @@ class Locomotive.Views.Inputs.Rte.FileView extends Backbone.View
     picker:   false
 
   initialize: ->
-    _.bindAll(@, 'change_image', 'hide')
+    _.bindAll(@, 'change_image', 'insert_file', 'hide')
 
-    @$link      = $(@el)
-    @editor     = @options.editor
-    @$popover   = @$link.next('.image-dialog-content')
+    @$link        = $(@el)
+    @editor       = @options.editor
+    @$popover     = @$link.next('.image-dialog-content')
+
+    @pubsub_token = PubSub.subscribe('file_picker.select', @insert_file)
 
   render: ->
     @attach_editor()
@@ -55,6 +57,19 @@ class Locomotive.Views.Inputs.Rte.FileView extends Backbone.View
 
     @hide()
 
+  insert_file: (msg, data) ->
+    return unless data.parent_view.cid == @.cid
+
+    if data.image
+      @editor.composer.commands.exec 'insertImage',
+        src:    data.url
+        title:  data.title
+    else
+      html = "<a href='#{data.url}' title='#{data.title}'>#{data.title}</a>"
+      @editor.composer.commands.exec 'insertHTML', html
+
+    @hide()
+
   show: (state) ->
     console.log "[insertFileView] show #{state}"
 
@@ -99,6 +114,10 @@ class Locomotive.Views.Inputs.Rte.FileView extends Backbone.View
     window.application_view.drawer_view.close()
     @opened.picker = false
 
+  hide_from_picker: (stack_size) ->
+    if stack_size == 0
+      @opened.picker = false
+
   hide_popover: ->
     @$link.popover('hide')
     @opened.popover = false
@@ -113,4 +132,5 @@ class Locomotive.Views.Inputs.Rte.FileView extends Backbone.View
     @detach_popover_events()
     @$link.popover('destroy')
     @$('.popover').remove()
+    PubSub.unsubscribe(@pubsub_token)
     super

data/app/assets/javascripts/locomotive/views/inputs/rte_view.js.coffee.erb

@@ -6,6 +6,8 @@ class Locomotive.Views.Inputs.RteView extends Backbone.View
     'click a.style': 'open_styles_dialog'
 
   initialize: ->
+    _.bindAll(@, 'register_keydown_event', 'on_content_change')
+
     $textarea = @$('textarea')
 
     @editor = new wysihtml5.Editor $textarea.attr('id'),
@@ -14,6 +16,10 @@ class Locomotive.Views.Inputs.RteView extends Backbone.View
       parserRules:    wysihtml5ParserRules
       stylesheets:    ['<%= stylesheet_path("locomotive/wysihtml5_editor") %>']
 
+    @editor.on 'load', @register_keydown_event
+    @editor.on 'change', @on_content_change
+    @editor.on 'aftercommand:composer', @on_content_change
+
     that = @
     setTimeout(
       ->
@@ -46,9 +52,21 @@ class Locomotive.Views.Inputs.RteView extends Backbone.View
 
     @file_view.render()
 
+  register_keydown_event: ->
+    @$('.wysihtml5-sandbox').contents().find('body').on 'keyup', =>
+      @on_content_change()
+
+  on_content_change: ->
+    PubSub.publish 'inputs.text_changed',
+      view:     @
+      content:  @editor.getValue()
+
   remove: ->
     @link_view.remove()
     @file_view.remove()
 
+    @editor.stopObserving('onLoad', @register_keydown_event)
+    @editor.stopObserving('onChange', @on_content_change)
+
     super
 

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

@@ -1,8 +1,5 @@
-# Locomotive.Views.Pages ||= {}
+Locomotive.Views.Pages ||= {}
 
-# class Locomotive.Views.Pages.NewView extends Locomotive.Views.Pages.FormView
+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')
+  el: '.main'

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

@@ -30,9 +30,22 @@ class Locomotive.Views.Shared.DrawerView extends Backbone.View
     @show(entry)
 
   pop: ->
-    entry = @stack.pop(entry)
+    entry = @stack.pop()
     @hide entry, => @show(@last_entry())
 
+  replace: (entry) ->
+    last_entry = @stack.pop()
+    _container = @container(true)
+
+    @stack.push(entry)
+
+    if entry.url?
+      _container.load entry.url, =>
+        last_entry.view.remove() if last_entry
+        @_show(entry, _container)
+    else
+      @_show(entry, _container)
+
   show: (entry) ->
     return if entry == null
 
@@ -50,16 +63,16 @@ class Locomotive.Views.Shared.DrawerView extends Backbone.View
     , timeout
 
   hide: (entry, callback) ->
-    return if entry == null
-
     if @stack.length == 0
       $('body').removeClass('drawer-opened')
     else
-      entry.view.$el.addClass('fadeout')
+      entry.view.$el.addClass('fadeout') if entry?
 
     setTimeout =>
-      entry.view.hide_from_drawer(@stack.length) if entry.view.hide_from_drawer?
-      entry.view.remove()
+      if entry?
+        entry.view.hide_from_drawer(@stack.length) if entry.view.hide_from_drawer?
+        entry.view.remove()
+
       callback() if callback?
     , @delays.remove
 
@@ -69,8 +82,11 @@ class Locomotive.Views.Shared.DrawerView extends Backbone.View
     else
       @stack[@stack.length - 1]
 
-  container: ->
-    @$('> .inner').html('<div></div>').find('> div')
+  container: (preserve) ->
+    if preserve? && preserve
+      @$('> .inner').find('> div')
+    else
+      @$('> .inner').html('<div></div>').find('> div')
 
   _show: (entry, container) ->
     _klass      = entry.view_klass

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

@@ -14,6 +14,8 @@ class Locomotive.Views.Shared.FormView extends Backbone.View
   render: ->
     @display_active_nav()
 
+    @enable_hover()
+
     @enable_file_inputs()
     @enable_array_inputs()
     @enable_toggle_inputs()
@@ -22,20 +24,7 @@ class Locomotive.Views.Shared.FormView extends Backbone.View
     @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()
+    @enable_select_inputs()
 
     return @
 
@@ -46,16 +35,26 @@ class Locomotive.Views.Shared.FormView extends Backbone.View
       @$(".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)
+    if $('form .nav-tabs li.active a').size() > 0
+      tab_name = $('form .nav-tabs li.active a').attr('href').replace('#', '')
+      @$('#active_tab').val(tab_name)
 
   change_state: ->
     @$('form button[type=submit]').button('loading')
 
+  reset_state: ->
+    @$('form button[type=submit]').button('reset')
+
   save: (event) ->
     @change_state()
     @record_active_tab()
 
+  enable_hover: ->
+    $('.form-group.input').hover ->
+      $(this).addClass('hovered')
+    , ->
+      $(this).removeClass('hovered')
+
   enable_file_inputs: ->
     self = @
     @$('.input.file').each ->
@@ -106,6 +105,9 @@ class Locomotive.Views.Shared.FormView extends Backbone.View
   enable_tags_inputs: ->
     @$('.input.tags input[type=text]').tagsinput()
 
+  enable_select_inputs: ->
+    @$('.input.select select:not(.disable-select2)').select2()
+
   enable_document_picker_inputs: ->
     self = @
     @$('.input.document_picker').each ->
@@ -114,138 +116,9 @@ class Locomotive.Views.Shared.FormView extends Backbone.View
       self.inputs.push(view)
 
   remove: ->
-    self.inputs.each (view) -> view.remove()
-    @$('.input.tags input[type=text').tagsinput('destroy')
+    _.each @inputs.each, (view) -> view.remove()
+    @$('.input.tags input[type=text]').tagsinput('destroy')
+    @$('.input.select select').select2('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()

data/app/assets/stylesheets/locomotive/application.scss

@@ -12,10 +12,15 @@
 @import "./globals/bootstrap";
 @import "bootstrap";
 
+@import "./globals/nprogress";
+@import "nprogress";
+@import "nprogress-bootstrap";
+
 @import "./base/all";
 
 @import "layouts/main";
 @import "layouts/responsive";
+@import "layouts/live_editing";
 
 @import "components/misc";
 @import "components/transitions";
@@ -25,5 +30,6 @@
 @import "components/main";
 @import "components/list";
 @import "components/content_assets";
+@import "components/live_editing";
 
 @import "components/sites";

data/app/assets/stylesheets/locomotive/base/_form.scss

@@ -11,3 +11,4 @@
 @import "./form/api_key";
 @import "./form/popover";
 @import "./form/document_picker";
+@import "./form/link";

data/app/assets/stylesheets/locomotive/base/form/_base.scss

@@ -59,6 +59,15 @@
         }
       }
 
+      &.hovered {
+        background-color: $form_input_hovered_background_color;
+
+        .form-wrapper {
+          border-color: $form_input_hovered_control_border_color;
+        }
+      }
+
+
     }
 
     .has-error {

data/app/assets/stylesheets/locomotive/base/form/_file_input.scss

@@ -21,7 +21,7 @@
           text-indent: -99999;
         }
 
-        .current-file {
+        .current-file, .new-file {
           img {
             border: 2px solid $form_input_control_border_color;
             width: 29px;

data/app/assets/stylesheets/locomotive/base/form/_link.scss

@@ -0,0 +1,13 @@
+.simple_form {
+  fieldset .input.link {
+
+    .form_wrapper {
+      margin-top: 0px;
+      margin-left: 15px;
+      float: right;
+      position: relative;
+      top: -4px;
+    }
+
+  }
+}

data/app/assets/stylesheets/locomotive/base/form/_select2.scss

@@ -4,7 +4,7 @@ $select2-height:                  32px;
 
 .simple_form {
 
-  fieldset .input.select2 .form-wrapper {
+  fieldset .input.select .form-wrapper {
     border: none;
   }
 
@@ -105,3 +105,30 @@ $select2-height:                  32px;
     margin-right: 5px;
   }
 }
+
+.simple_form {
+  fieldset .input.select.inline {
+    .form-wrapper {
+      margin-top: 0px;
+      margin-left: 15px;
+      float: right;
+      position: relative;
+      top: -8px;
+
+      .select2-container {
+        width: 280px;
+
+        .select2-choice {
+          height: 18px;
+          line-height: 18px;
+
+          .select2-arrow {
+            b {
+              background-position: 0px -2px;
+            }
+          }
+        }
+      }
+    }
+  }
+}