Rails - Sep 2010 - Getting the dimensions of an image element

I have a view file, "show.html.erb", and a Javascript file,
"coordinate.js".

In coordinate.js" I have methods to calculate the width and height of an
image.

How can I call those methods on the "Canvas" in my view.

And, below you can find the scripts of the two files:

* show.html.erb

<%= javascript_include_tag "coordinate" %>
<canvas id="draw"  height= "512"
width="512">
</canvas>
<p id="notice"><%= notice %></p>
<p>
<b> Name </b>
<%= @dicom.name %>
</p>
<p>
<b> Image </b>
</p>
<div id="image_element" style="display: none;">
<p>
<%= image_tag @dicom.photo.url , :id => ''dicom_image''
%>
</p>
</div>
<%= update_page_tag do |page|
page << "drawImg();"
end
%>
<%= update_page_tag do |page|
page << "drawLine();"
end
%>
<%= link_to ''Edit'', edit_dicom_path(@dicom) %>
<%= link_to ''Back'', dicoms_path %>

* coordinate.js

function getWidth() {
  var image = document.getElementById("dicom_image");
  imageWidth = image.width;
  return imageWidth;
  //alert("Image Width is " + image.width);
}

function getHeight(){
  var image = document.getElementById("dicom_image");
  imageHeight = image.height;
  return imageHeight;
  //alert("Image Height is " + image.height);
}

function imageWidthAndHeight()
{
  getWidth();
  getHeight();
}

function getTopLeftCoordinate() {
  x=document.getElementById(''dicom_image'').offsetLeft
  y=document.getElementById(''dicom_image'').offsetTop
  alert(x);
  alert(y);
}

function getLeftCoordinate() {
  left=document.getElementById(''dicom_image'').offsetLeft
  return left;
}

function getTopCoordinate() {
  top= document.getElementById(''dicom_image'').offsetTop
  return top;
}

function drawImg(){
  var canvas = document.getElementById("draw");
  var context = canvas.getContext("2d");
  var image = document.getElementById("dicom_image");
  // render the image to the canvas., an then specify the coordinates
  //(x,y) that specify where the image will be located at the canvas
  context.drawImage(image, 0, 0);
}

function drawLine(){
  var canvas = document.getElementById(''draw'');
  var context = canvas.getContext(''2d'');
  context.beginPath();
  context.moveTo(getLeftCoordinate(), getTopCoordinate());
  context.lineTo(100, 200);
  context.strokeStyle = "#FFF"
  context.stroke();
}

Thanks.
-- 
Posted via http://www.ruby-forum.com/.

-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.

Since I''m using Paperclip, I will ask as follows:

I have the following in my model and view. What should I place instead 
of ????? in the view (show.html.erb)?

*Model:

class Dicom < ActiveRecord::Base
  has_attached_file :photo, :styles => {:original => ["100%",
:jpg]}

  def getHeight()
    uploaded_file = photo.queued_for_write[:original]
    dimensions = Paperclip::Geometry.from_file(uploaded_file)
    height = dimensions.height
    return height
  end

  def getWidth()
    uploaded_file = photo.queued_for_write[:original]
    dimensions = Paperclip::Geometry.from_file(uploaded_file)
    width = dimensions.width
    return width
    end
  end

* View:

<%= javascript_include_tag "coordinate" %>
<canvas id="draw"  height= "<%=????? %>"
width="<%=????? %>" >
</canvas>
<p id="notice"><%= notice %></p>
<p>
<b> Name </b>
<%= @dicom.name %>
</p>
<p>
<b> Image </b>
</p>
<div id="image_element" style="display: none;">
<p>
<%= image_tag @dicom.photo.url , :id => ''dicom_image''
%>
</p>
</div>
<%= update_page_tag do |page|
page << "drawImg();"
end
%>
<%= update_page_tag do |page|
page << "drawLine();"
end
%>
<%= link_to ''Edit'', edit_dicom_path(@dicom) %>
<%= link_to ''Back'', dicoms_path %>
-- 
Posted via http://www.ruby-forum.com/.

-- 
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Talk" group.
To post to this group, send email to
rubyonrails-talk-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-talk+unsubscribe-/JYPxA39Uh5TLH3MbocFF+G/Ez6ZCGd0@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-talk?hl=en.