github-migration/engine
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

it becomes possible to add options for the select type

Browse Source
This commit is contained in:
did 2011-12-22 07:45:42 -08:00
parent 81a6569fe7
commit 2068fe060d
9 changed files with 209 additions and 33 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
app/assets/javascripts/locomotive/models/custom_field.js.coffee
View File

@ -13,7 +13,8 @@ class Locomotive.Models.CustomField extends Backbone.Model
toJSONForSave: ->
_.tap {}, (hash) =>
for key, value of @.toJSON()
hash[key] = value unless _.include(['type_text', 'created_at', 'updated_at'], key)
hash[key] = value unless _.include(['select_options', 'type_text', 'created_at', 'updated_at'], key)
hash.select_options_attributes = @get('select_options').toJSONForSave() if @get('select_options')
class Locomotive.Models.CustomFieldsCollection extends Backbone.Collection

32
app/assets/javascripts/locomotive/views/content_types/custom_field_entry_view.js.coffee
View File

@ -10,15 +10,45 @@ class Locomotive.Views.ContentTypes.CustomFieldEntryView extends Backbone.View
'click a.toggle': 'toggle'
'click a.remove': 'remove'
initialize: ->
@model.bind 'change', (custom_field) =>
@switch_to_type() if @model.hasChanged('type')
render: ->
$(@el).html(ich.custom_field_entry(@model.toJSON()))
Backbone.ModelBinding.bind @, all: 'class'
@$('span.label-input input[type=text], span.type-input select').editableField()
@make_fields_editable()
@enable_behaviours()
@switch_to_type()
return @
enable_behaviours: ->
@render_select_options_view()
switch_to_type: ->
@$('li.input.extra').hide() # reset
switch @model.get('type')
when 'select'
@$('li.input.select-options').show()
when 'text'
@$('li.input.text-formatting').show()
render_select_options_view: ->
@select_options_view = new Locomotive.Views.ContentTypes.SelectOptionsView
model: @model
collection: @model.get('select_options')
@$('#content_type_contents_custom_field_select_options_input').append(@select_options_view.render().el)
make_fields_editable: ->
@$('span.label-input input[type=text], span.type-input select').editableField()
toggle: (event) ->
event.stopPropagation() & event.preventDefault()
form = @$('ol')

28
app/assets/javascripts/locomotive/views/content_types/custom_fields_view.coffee
View File

@ -38,19 +38,17 @@ class Locomotive.Views.ContentTypes.CustomFieldsView extends Backbone.View
add_entry: (event) ->
event.stopPropagation() & event.preventDefault()
labelInput = @$('.new-entry input[name=label]')
typeInput = @$('.new-entry select')
labelInput = @$('> .new-entry input[name=label]')
typeInput = @$('> .new-entry select')
if labelInput.val() != ''
custom_field = new Locomotive.Models.CustomField label: labelInput.val(), type: typeInput.val()
window.bar = custom_field
@model.get('contents_custom_fields').add(custom_field)
@_insert_entry(custom_field)
@$('.empty').hide()
@$('> .empty').hide()
@sortable_list.sortable('refresh')
@ -66,11 +64,11 @@ class Locomotive.Views.ContentTypes.CustomFieldsView extends Backbone.View
@refresh_position_entries()
@$('.empty').show() if @model.get('contents_custom_fields').length == 0
@$('> .empty').show() if @model.get('contents_custom_fields').length == 0
render_entries: ->
if @model.get('contents_custom_fields').length == 0
@$('.empty').show()
@$('> .empty').show()
else
@model.get('contents_custom_fields').each (custom_field) =>
@_insert_entry(custom_field)
@ -80,18 +78,6 @@ class Locomotive.Views.ContentTypes.CustomFieldsView extends Backbone.View
(@_entry_views ||= []).push(view)
@$('ul').append(view.render().el)
@refresh_position_entries()
#
# show_errors: ->
# _.each @options.errors.domain || [], (message) => @show_error(message)
#
# show_error: (message) ->
# _.each (@_entry_views || []), (view) ->
# if new RegExp("^#{view.model.get('name')}").test message
# html = $('<span></span>').addClass('inline-errors').html(message)
# view.$('input[type=text].path').after(html)
@$('> ul').append(view.render().el)
@refresh_position_entries()

5
app/assets/javascripts/locomotive/views/content_types/new_view.js.coffee
View File

@ -5,4 +5,7 @@ class Locomotive.Views.ContentTypes.NewView extends Locomotive.Views.ContentType
save: (event) ->
@save_in_ajax event,
on_success: (response, xhr) ->
window.location.href = xhr.getResponseHeader('location')
window.location.href = xhr.getResponseHeader('location')
enable_liquid_editing: ->
true # do nothing

85
app/assets/javascripts/locomotive/views/content_types/select_options_view.js.coffee Normal file
View File

@ -0,0 +1,85 @@
Locomotive.Views.ContentTypes ||= {}
class Locomotive.Views.ContentTypes.SelectOptionsView extends Backbone.View
tagName: 'div'
className: 'list'
events:
'click a.add': 'add_entry'
'click span.name': 'edit_entry'
'click a.remove': 'remove_entry'
initialize: ->
_.bindAll(@, 'refresh_position_entries', '_insert_entry')
@collection.bind 'add', @_insert_entry
render: ->
$(@el).html(ich.select_options_list())
@prompt_message = @$('> ul').attr('data-prompt')
@render_entries()
@make_list_sortable()
return @
render_entries: ->
@collection.each @_insert_entry
make_list_sortable: ->
@sortable_list = @$('> ul').sortable
handle: 'a.drag'
items: 'li.entry'
update: @refresh_position_entries
refresh_position_entries: ->
@$('> ul li.entry').each (index, view_dom) =>
select_option = @collection.getByCid($(view_dom).attr('data-cid'))
select_option.set position: index
add_entry: (event) ->
event.stopPropagation() & event.preventDefault()
name = prompt(@prompt_message)
if name != ''
@collection.add [{ name: name }]
edit_entry: (event) ->
event.stopPropagation() & event.preventDefault()
span = $(event.target)
view_dom = span.closest('li')
select_option = @collection.getByCid(view_dom.attr('data-cid'))
if (name = prompt(@prompt_message, select_option.get('name'))) != ''
select_option.set(name: name)
span.html(name)
remove_entry: (event) ->
event.stopPropagation() & event.preventDefault()
link = $(event.target)
view_dom = link.closest('li')
select_option = @collection.getByCid(view_dom.attr('data-cid'))
if confirm(link.attr('date-confirm'))
if select_option.isNew()
@collection.remove(select_option)
else
select_option.set _destroy: true
view_dom.remove()
_insert_entry: (select_option) ->
view_dom = ich.select_option_entry(select_option.toJSON())
view_dom.attr('data-cid', select_option.cid)
@$('> ul').append(view_dom)
@refresh_position_entries

55
app/assets/stylesheets/locomotive/formtastic_changes.scss
View File

@ -122,7 +122,7 @@ form.formtastic {
padding-left: 10px;
}
a.remove, a.toggle {
a.remove, a.toggle, a.drag {
display: inline-block;
width: 16px;
height: 16px;
@ -146,6 +146,14 @@ form.formtastic {
background-image: image-url("locomotive/list/icons/toggle.png");
}
}
&.drag {
cursor: move;
background: transparent image-url("locomotive/list/icons/toggle_off.png") repeat 0 0;
&:hover {
background-image: image-url("locomotive/list/icons/toggle.png");
}
}
}
}
@ -362,7 +370,7 @@ form.formtastic {
&.no-label {
padding-top: 6px;
.list {
> .list {
margin-left: 0;
.entry {
@ -384,6 +392,49 @@ form.formtastic {
}
} // li.no-label
&.select-options {
.list {
line-height: auto;
ul, li, > span.actions {
float: left;
}
ul {
width: 558px;
min-height: 34px;
li.entry {
background: #c2e0f0;
@include border-radius(2px);
padding: 0 55px 0 8px;
margin: 2px 10px 8px 0;
height: auto;
color: #29739b;
line-height: 24px;
span.name {
cursor: pointer;
@include text-shadow(#fff 0px 1px 1px);
}
span.actions {
line-height: 20px;
right: 8px;
}
}
} // .list ul
> span.actions {
position: static;
margin-left: 15px;
line-height: 24px;
} // .list .actions
}
} // li.select-options
&#site_memberships_input {
.entry {
em.email {

24
app/views/locomotive/custom_fields/_form.html.haml
View File

@ -40,10 +40,28 @@
= g.input :hint, :input_html => { :class => 'hint' }
= g.input :select_options, :as => :'Locomotive::Empty', :wrapper_html => { :style => 'display: none' }
= g.input :select_options, :as => :'Locomotive::Empty', :wrapper_html => { :class => 'extra select-options', :style => 'display: none' }
= g.input :text_formatting, :as => :select, :collection => options_for_text_formatting, :include_blank => false, :wrapper_html => { :style => 'display: none' }
= g.input :text_formatting, :as => :select, :collection => options_for_text_formatting, :include_blank => false, :wrapper_html => { :class => 'extra text-formatting', :style => 'display: none' }
%span.actions
= link_to 'toggle', '#', :class => 'toggle'
= link_to 'x', '#', :class => 'remove', :confirm => t('locomotive.messages.confirm')
= link_to 'x', '#', :class => 'remove', :confirm => t('locomotive.messages.confirm')
%script{ :type => 'text/html', :id => 'select_options_list' }
%ul{ :'data-prompt' => t('.select_options.ask_name') }
%span.actions
= link_to t('locomotive.buttons.new_item'), '#', :class => 'add'
%script{ :type => 'text/html', :id => 'select_option_entry' }
%li.entry
%span.name {{name}}
%span.actions
= link_to 'drag', '#', :class => 'drag'
= link_to 'x', '#', :class => 'remove', :confirm => t('locomotive.messages.confirm')

2
config/locales/admin_ui.en.yml
View File

@ -77,6 +77,8 @@ en:
form:
is_required: is required
default_label: Field name
select_options:
ask_name: "Type the label of the option"
sessions:
new:

8
doc/TODO
View File

@ -46,12 +46,12 @@ x edit my site
x slugify
x refactor highlighted_field (field id instead of name)
x other content type options
- show / hide options of a field based on its type
- text: formatting
- select: add/edit/remove options
x show / hide options of a field based on its type
x select: add/edit/remove options
x text: formatting
- change in main menu
- manage contents
- list
- list (highlighted field)
- crud
- disallow to click twice on the submit form button (spinner ?)