Save image from URL using Carrierwave

Question

I'm pretty basic with Rails and I'm trying to save a image from URL, after googling around I've found the Carrierwave gem which I installed. But I'm not sure how to proceed. I'm also using Backbone (which I'm also pretty basic with).

So far I've created a app where users can type a moviename in a inputfield which then shows a list of results.

My moviesearch view,

events:
  "keyup input": "doSearch"

doSearch: (e) ->
  @collection.setQuery $(e.currentTarget).val()
  @collection.fetch()
  $('.autocomplete-results').show()

When the doSearch function gets fired it goes to the moviesearch collection,

class Movieseat.Collections.Moviesearch extends Backbone.Collection

  url: -> "http://api.themoviedb.org/3/search/movie?api_key=a8f7039633f2065942cd8a28d7cadad4&query=#{@query}"

  setQuery: (q) ->
    @query = q
    return

  parse: (response) ->
    return response.results

This results in a JSON file like this,

http://api.themoviedb.org/3/search/movie?api_key=a8f7039633f2065942cd8a28d7cadad4&query=star%20war

My searchresult view then renders the moviesearch view in the searchresult template

template: JST['movieseats/searchresult']

initialize: -> 
  @collection.on('add', @render, this)
  return

render: -> 
  $(@el).html(@template(movie: @collection))
  this

The searchresult template,

<% for movie in @movie.models : %>
    <li>
        <img src="http://image.tmdb.org/t/p/w500/<%= movie.get('poster_path')%>"></img>
        <span class="movie-title"><%= movie.get('title') %></span>
        <p class="releaste_date"><%= movie.get('release_date') %></p>
        <p class="addmovie">Add movie</p>
    </li> 
<% end %>

This was all Backbone. The following step is to store the data. The addEntry function saves the variable movie_title to my Rails model.

addEntry: (e) -> 
  movie_title = $(e.target).parent().find('.movie-title').text()
  @collection.create title: movie_title

This function finds the text in a .movie-title in this template,

<% for movie in @movie.models : %>
    <li>
        <img src="http://image.tmdb.org/t/p/w500/<%= movie.get('poster_path')%>"></img>
        <span class="movie-title"><%= movie.get('title') %></span>
        <p class="releaste_date"><%= movie.get('release_date') %></p>
        <p class="addmovie">Add movie</p>
    </li> 
<% end %>

I have a rails controller called movies_controller. This has a the following create definition

def create
  @movie = Movie.new(movie_params)
  @user = current_user
  user_id = @user[:id]
  @movie[:user_id] = user_id

  respond_to do |format|
    if @movie.save
      format.html { redirect_to @movie, notice: 'Movie was successfully created.' }
      format.json { render json: @movie, status: :created, location: @movie }
    else
      format.html { render action: "new" }
      format.json { render json: @movie.errors, status: :unprocessable_entity }
    end
  end
end

As you can see I have a <img src="http://image.tmdb.org/t/p/w500/<%= movie.get('poster_path')%>"></img> This is the image I would like to save in my Rails model.

How do I proceed from here? I've found the following post and this code,

uploader = ImageUploader.new
uploader.download! some_remote_url
uploader.store!

But in that post there's no documentation posted so I don't know how to implement this code in my project. Also I've looked in the documentation on the Git page but I'm finding it hard to find what I need to do.

The documentation is actually [very good](https://github.com/carrierwaveuploader/carrierwave) — j-dexx, Oct 30 '14 at 14:17
Have you got an uploader defined and mounted on your `Movie` model? — j-dexx, Oct 30 '14 at 14:32
Alright, read some more. Found [this])http://richonrails.com/articles/allowing-file-uploads-with-carrierwave) which helped. Rewatched the RailsCast and I've got a little bit more of a grasp on it. But I still dont know how to get the image from the DOM. — Peter Boomsma, Oct 30 '14 at 16:26
How do you get this `"http://image.tmdb.org/t/p/w500/<%= movie.get('poster_path')%>"` What does move.get('poster_path') do? Can you add this part of the class into your question — j-dexx, Oct 30 '14 at 16:36

score 1 · Answer 1 · answered Oct 30 '14 at 16:40

1

Assuming that this is the path to the image you want to host

"http://image.tmdb.org/t/p/w500/<%= movie.get('poster_path')%>"

You should be able to do something like

def create
  @movie = Movie.new(movie_params)
  @movie.remote_image_url = "http://image.tmdb.org/t/p/w500/#{@movie.get('poster_path')}"
  #rest of code
end

answered Oct 30 '14 at 16:40

j-dexx

10,286
3
23
36

Okay. I think I'm almost there. Do I need to create a reference to `remote_image_url` in my template file where the image url path is rendered? I suppose so. But how would that look? I guess I could create a invisible inputfield with the value of the image and a label for it. But I don't think that's the way to do it. – Peter Boomsma Oct 30 '14 at 16:57

score 0 · Answer 2 · answered Oct 30 '14 at 15:02

0

loading images from remore urls is really simple
Take a look at this railscasts

MODEL.remote_image_url = 'http:...jpg'

<%= form_for @painting, :html => {:multipart => true} do |f| %>    
  <p>  
    <%= f.label :name %><br />  
    <%= f.text_field :name %>  
  </p>  
  <p>  
    <%= f.file_field :image %>  
  </p>  
  <p>  
    <%= f.label :remote_image_url, "or image URL" %>  
    <%= f.text_field :remote_image_url %>  
  </p>  
  <p><%= f.submit %></p>  
<% end %>

answered Oct 30 '14 at 15:02

MZaragoza

10,108
9
71
116

In this example users can input the url of the image in the text field? I'm looking for a way where the image is allready in the DOM. – Peter Boomsma Oct 30 '14 at 16:25

Save image from URL using Carrierwave

2 Answers2