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

use the slugify js plugin for the page form

Browse Source
This commit is contained in:
did 2011-12-05 06:14:50 -08:00
parent 8af3445045
commit 1b8c1c7157
3 changed files with 13 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
app/assets/javascripts/locomotive/views/pages/_form_view.js.coffee
View File

@ -7,8 +7,6 @@ class Locomotive.Views.Pages.FormView extends Locomotive.Views.Shared.FormView
el: '#content' el: '#content'
events: events:
'keypress #page_title': 'fill_default_slug'
'keypress #page_slug': 'mark_filled_slug'
'change #page_parent_id': 'change_page_url' 'change #page_parent_id': 'change_page_url'
'click a#image-picker-link': 'open_image_picker' 'click a#image-picker-link': 'open_image_picker'
'submit': 'save' 'submit': 'save'
@ -18,7 +16,8 @@ class Locomotive.Views.Pages.FormView extends Locomotive.Views.Shared.FormView
@model = new Locomotive.Models.Page(@options.page) @model = new Locomotive.Models.Page(@options.page)
@filled_slug = @touched_url = false @touched_url = false
@image_picker_view = new Locomotive.Views.ThemeAssets.ImagePickerView @image_picker_view = new Locomotive.Views.ThemeAssets.ImagePickerView
collection: new Locomotive.Models.ThemeAssetsCollection() collection: new Locomotive.Models.ThemeAssetsCollection()
on_select: @insert_image on_select: @insert_image
@ -30,6 +29,9 @@ class Locomotive.Views.Pages.FormView extends Locomotive.Views.Shared.FormView
render: -> render: ->
super() super()
# slugify the slug field from title
@slugify_title()
# the url gets modified by different ways so reflect the changes in the UI # the url gets modified by different ways so reflect the changes in the UI
@listen_for_url_changes() @listen_for_url_changes()
@ -84,22 +86,18 @@ class Locomotive.Views.Pages.FormView extends Locomotive.Views.Shared.FormView
# Remove the editable elements and rebuild them # Remove the editable elements and rebuild them
reset_editable_elements: -> reset_editable_elements: ->
console.log('reset_editable_elements')
@editable_elements_view.remove() @editable_elements_view.remove()
@editable_elements_view.collection = @model.get('editable_elements') @editable_elements_view.collection = @model.get('editable_elements')
@render_editable_elements() @render_editable_elements()
# Just re-connect the model and the views (+ rebuild the files) # Just re-connect the model and the views (+ redraw the file fields)
refresh_editable_elements: -> refresh_editable_elements: ->
@editable_elements_view.collection = @model.get('editable_elements') @editable_elements_view.collection = @model.get('editable_elements')
@editable_elements_view.refresh() @editable_elements_view.refresh()
fill_default_slug: (event) -> slugify_title: ->
unless @filled_slug @$('#page_title').slugify(target: @$('#page_slug'))
setTimeout (=> @$('#page_slug').val($(event.target).val().slugify('-')) & @touched_url = true), 30 @$('#page_slug').bind 'change', ((event) => @touched_url = true)
mark_filled_slug: (event) ->
@filled_slug = true
listen_for_url_changes: -> listen_for_url_changes: ->
setInterval (=> (@change_page_url() & @touched_url = false) if @touched_url), 2000 setInterval (=> (@change_page_url() & @touched_url = false) if @touched_url), 2000

2
app/assets/javascripts/locomotive/views/snippets/_form_view.js.coffee
View File

@ -15,8 +15,6 @@ class Locomotive.Views.Snippets.FormView extends Locomotive.Views.Shared.FormVie
@model = new Locomotive.Models.Snippet(@options.snippet) @model = new Locomotive.Models.Snippet(@options.snippet)
window.foo = @model
@image_picker_view = new Locomotive.Views.ThemeAssets.ImagePickerView @image_picker_view = new Locomotive.Views.ThemeAssets.ImagePickerView
collection: new Locomotive.Models.ThemeAssetsCollection() collection: new Locomotive.Models.ThemeAssetsCollection()
on_select: @insert_image on_select: @insert_image

5
vendor/assets/javascripts/slugify.js vendored
View File

@ -17,7 +17,10 @@ $.fn.slugify = function(settings) {
var source = $(this); var source = $(this);
var newVal = source.val().slugify(settings.sep); var newVal = source.val().slugify(settings.sep);
if (!target.data('touched')) target.val(newVal); if (!target.data('touched')) {
target.val(newVal);
target.trigger('change');
}
} }
target.bind('keyup', function(event) { target.bind('keyup', function(event) {