New Discussion

Notifications

You’re not receiving notifications from this thread.

Coffeescript Instantiation

2
Javascript

I've got a bunch of images thumbnails in an admin area. Wherever one appears, I'd like to be able to click on it, open up a modal with a form, and let the attributes of the image be edited from that form.

To start, I'd first just like to be able to pop open the modal when somebody clicks on a thumbnail, but I'm running into an issue where I'm not sure what's wrong.

thumbnail html:

<div class="col-xs-6 col-md-3" data-behavior="image-thumbnail" data-image-id="1">
  <div class="thumbnail">
     <img class="attachment image file" src="blahblah" alt="Screen+shot+2015 05 29+at+10.29.10+pm" /> 
  </div>
</div>

.erb template for an individual image thumbnail

<div class="col-xs-6 col-md-3" data-behavior="image-thumbnail" data-image-id="<%= image.id %>">
  <div class="thumbnail">
     <%= attachment_image_tag(image, :file, :fill, 300, 300) %> 
  </div>
</div>

images.js.coffee

class Thumbnail
  contructor: (item) ->
    console.log "contructor"
    @thumbnail = item
    @setEvents()

  setEvents: ->
    @thumbnail.on "click", @revealModal

  revealModal: =>
    console.log "wow"
    $("[data-behavior='image-thumbnail-modal']").modal('show')

jQuery ->
  console.log "ready"
  new Thumbnail $("[data-behavior='image-thumbnail']")

alternately, I've tried instantiating the coffeescript objects like this:

  $.map $("[data-behavior='image-thumbnail']"), (item, i) ->
    new Thumbnail(item)

The console logs "ready," but I never make it into the constructor. Where am I going wrong here?

omg...

 contructor: (item) ->

should be

  constructor

:'( :'(

Haha! Always the simplest things producing the hardest problems.

Join the discussion
Create an account Log in

Learning Ruby on Rails? Join our newsletter.

We won't send you spam. Unsubscribe at any time.