Forum: Ruby on Rails display pictures in database

Announcement (2017-05-07): www.ruby-forum.com is now read-only since I unfortunately do not have the time to support and maintain the forum any more. Please see rubyonrails.org/community and ruby-lang.org/en/community for other Rails- und Ruby-related community platforms.
Peter (Guest)
on 2007-01-05 21:36
I can upload pictures to a database, then display all pictures via the
filename, the files are currently stored on the filesystem...

  for picture in @pictures
  -%>
  <p>
  <span onmouseover="set_selected_pic(<%=indx%>);">
    <%=image_tag(picture.name,
        :size=>"50x50", :id=>"side_image_" + indx.to_s,
        :style=>"border:0;", :alt=>"Images")-%>
        <%indx = indx + 1-%>
  </span>
  </p>
  <% end %>

  I changed the code to upload images into a BLOB field in the database
cause I don't want to use the filesystem to serve up images any longer.
How can I change this rhtml code so that it goes to the BLOB field in
the database and display the pictures?

This is the code that builds the picture array,

  def find_8_pics
    total_pics = Picture.count
    @page_num = @params[:page_num].to_i
    if(@page_num < 0 or @page_num * 8 >= total_pics)
      @page_num = 0
    end
    offset = @page_num * 8

    if(offset + 9 <= total_pics)
      @next_page = @page_num + 1
    end

    if(@page_num != 0)
      @prev_page = @page_num - 1;
    end

    @pictures = Picture.find :all, :limit=>8, :offset=>offset
    @blank_images = 8 - @pictures.length

  end



Thanks,
Peter
Alex W. (Guest)
on 2007-01-05 21:56
Peter wrote:
>   I changed the code to upload images into a BLOB field in the database
> cause I don't want to use the filesystem to serve up images any longer.
> How can I change this rhtml code so that it goes to the BLOB field in
> the database and display the pictures?

You need to create an action that sends along the image data.

  def image
    @picture = Picture.find(params[:id)
    send_data @picture.data, :content_type => 'image/jpeg'
  end

Then just call the url for that action as the image url

  <%= image_tag url_for(:action => 'image', :id => 123) %>

Also check out FlexImage:
http://www.agilewebdevelopment.com/plugins/fleximage

It may make things easier for you.
Peter (Guest)
on 2007-01-05 23:54
Alex W. wrote:
> Peter wrote:
>>   I changed the code to upload images into a BLOB field in the database
>> cause I don't want to use the filesystem to serve up images any longer.
>> How can I change this rhtml code so that it goes to the BLOB field in
>> the database and display the pictures?
>
> You need to create an action that sends along the image data.
>
>   def image
>     @picture = Picture.find(params[:id)
>     send_data @picture.data, :content_type => 'image/jpeg'
>   end
>
> Then just call the url for that action as the image url
>
>   <%= image_tag url_for(:action => 'image', :id => 123) %>
>
> Also check out FlexImage:
> http://www.agilewebdevelopment.com/plugins/fleximage
>
> It may make things easier for you.

I got that part thanks.  Now my problem is that I have a thumbnail that,
when hovered over, populates a larger area in the center.  The problem
now is that the hover javascript references the .src counter value for
the picture being hovered over to correctly identify the
id(side_image_0)...with the files on disk, this works..

<span onmouseover="set_selected_pic(0);"
<img alt="Images" height="50" id="side_image_0" src="/picture/Larry.jpg"
style="border:0;" width="50"  />span>

..from the database src becomes /studio/picture/15, which doesn't work
with the hover...I tried setting alt="/studio/picture/Larry.jpg but
can't get that working...

<span onmouseover="set_selected_pic(0);"
<img alt="/studio/picture/Larry.jpg " height="50" id="side_image_0"
src="/studio/picture/15 " style="border:0;" width="50"  />span>


this is the hover javascript,

function set_selected_pic(i)
{
    $('side_image_' + cur_selection).style.border = '0px';
    $('side_image_' + i).style.border = '2px solid black';
    $('rollimg').src = $('side_image_' + i).src;
    cur_selection = i;
}


How can I populate the center pane with the image being hovered over
when src = "/studio/picture/15"
This topic is locked and can not be replied to.