I just installed RMagick and am trying to display a thumbnail of any image I throw at it on my webpage. But the code from the tutorial opens up a new window in order to show my image. Here's what I have.
require 'RMagick'
class StaticPagesController < ApplicationController
include Magick
def home
#cat = ImageList.new("app/assets/images/me.jpg")
end
end
and the view:
<%= #cat.display %>
I want the image to be displayed on the page instead a new window pops up displaying the image and this is displayed on the page:
#<Magick::ImageList:0x007f564804bb18>
UPDATE
I need to resize the image before I display it.
From the documentation of display:
Displays the images in the imagelist to any X Window screen. By
default displays to the local screen. You can specify a different
screen by assigning the name to the server_name attribute in the
optional arguments block.
That's not the right method to use in a HTML page. If you already have the image saved, you don't need to load it back into an ImageList. You can just display it in your view:
<%= image_tag "me.jpg" %>
should do the trick.
Related
I have added magnific popup gallery in my web page, everything works great. Just I want to know, is there any possibility add bullets in popup gallery below image in .mfp-bottom-bar.
The gallery example on Magnific's demo/homepage shows at least one way to achieve this, by feeding some markup into the return value of a function in the titleSrc option in the image option of the popup. In that example (from the page's source):
$('.popup-gallery').magnificPopup({
...
image: {
...
titleSrc: function(item) {
return item.el.attr('title') + '<small>by Marsel Van Oosten</small>';
}
}
});
The above case appends a <small> element to the current link's title attribute value/text, but you could presumably return some other <ul><li>...</li></ul> markup, or use jQuery to grab some existing <ul> in the markup (if relative to the current item, then presumably using item.el to help locate it).
I have a user interface with:
N.1 Push button (used to upload images)
N.2 QGraphicsView (left and right)
N.1 Push button that takes a print screen of the current image loaded on QGraphicsView left
Using the mouse is possible to:
1) zoom-in/zoom-out from the image
2) draw rectangles on the image.
I want to take the print screen of the image according to the zoom-in or zoom-out area I am using. However, once the file is saved it shows the entire image (wrong because I wanted only the enlarged or shrank part) with the rectangles drawn (this is correct).
According to this post QFileDialog was used in a similar way I am trying to do. I successfully used QFileDialog::getSaveFileName() to save the image. However it is not entirely solving the problem.
Below the pushbutton that takes care of taking the print screen of the image in the QGraphicsView left:
void MainWindow::on_addNewRecordBtn_clicked()
{
leftScene->clearSelection(); // Selections would also render to the file
leftScene->setSceneRect(leftScene->itemsBoundingRect()); // Re-shrink the scene to it's bounding contents
QImage image(leftScene->sceneRect().size().toSize(), QImage::Format_ARGB32); // Create the image with the exact size of the shrunk scene
image.fill(Qt::transparent); // Start all pixels transparent
QPainter painter(&image);
leftScene->render(&painter);
image.save(QFileDialog::getSaveFileName(this, tr("New Image Name"), QDir::rootPath(),
"Name (*.jpg *.jpeg *.png *.tiff *.tif)"));
}
The expected result would be saving the zoomed image (zoom.jpg for example) like this:
However when I save the image (zoom.jpg) the result that I am obtaining is constantly the entire image with the drawn features:
So if anyone needs, it is possible to take a print screen of an image no matter what the zoom in. Meaning you can zoom-in and zoom-out and take a print screen.
The following statement will do the job, grabbing the image your present (zoomed in or out status):
QImage image = ui->leftView->grab().toImage();
The only glitch is that the scroll bars horizontal and vertical (depending on the zoom) are also printed in your image. You can avoid that by setting them off right before taking the print screen and putting them back on right after.
Basically my previous function can be better written as follows:
void MainWindow::on_addNewRecordBtn_clicked()
{
leftScene->setSceneRect(leftScene->itemsBoundingRect());
// Setting off the scroll bars
ui->leftView->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
ui->leftView->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
QImage image = ui->leftView->grab().toImage();
image.save(QFileDialog::getSaveFileName(this, tr("New Image Name"), QDir::rootPath(),
"Name (*.jpg *.jpeg *.png *.tiff *.tif)"));
// Putting the scroll bars back on
ui->leftView->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOn);
ui->leftView->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOn);
}
Hope this will be helpful in case you encountered my same problem.
I'm trying to generate a PDF following the instructions given in http://railscasts.com/episodes/153-pdfs-with-prawn-revised
I'm able to put a background image on a specific page by doing this:
image "#{Rails.root.to_s}/public/document_assets/1_cover.png", :at => [bounds.left - 30, bounds.top + 50], :fit => [#width, #height]
I also got an image to render on the background of multiple pages at once using:
repeat(2..3) { canvas { image("#{Rails.root.to_s}/public/document_assets/1_bg.png", :at => bounds.top_left, :fit => [#width, #height]) } }
but that renders the image on top of everything else on the page, so no text or other content is visible.
I can't seem to figure out how to set the background image property as described in the Prawn documentation. Does anyone know how to do this?
Thanks!
I figured out the problem. You can set the background option in the PDF class where the margins get set in the railscast example. My issue was that the image I was using was not the right size. When I sized it to 8.5x11" and 72px per inch, it worked.
I'm creating a custom SimpleForm input. It utilizes a javascript modal popup to select values.
I can basically get it to work if I include the modal partial in the form view, but I would ideally like to have the custom input push the partial to the template.
However, I can't get it to work. I'm trying this, but it doesn't render the partial correctly.
class ProductCategoryImageSelectInput < SimpleForm::Inputs::CollectionSelectInput
def input
html = ''
html << 'Launch demo modal'
File.open("#{Rails.root}/app/views/product_categories/_browse_modal.html.erb", 'r') do |f|
html << f.read
end
end
end
Any thoughts?
EDIT
I'm apparently too new of a user to post screenshots, but here are links to the differences in functionality:
When I embed the modal code in the form, I get this, which is the desired functionality:
working
When I try to put the modal code in the custom input, I get this instead:
not working
You can also render partial from a custom input using the SimpleForm::FormBuilder instance which is assigned to an instance variable named #builder:
class ProductCategoryImageSelectInput < SimpleForm::Inputs::CollectionSelectInput
def input
#builder.template.render(partial: 'product_categories/browse_modal', locals: { foo: 'bar'})
end
end
Weirdly, it seems I've already answered it here.
Does this work for you?
ERB.new(f.read).result(binding)
PS: Updated with ERB instead of HAML.
I am trying to add an icon next to a button, the icon appears, but, the location is wrong, and the button total width is wrong too, please check the image bellow, I tried to set the width of the red button, but, the icon still appear on the button text.
here is haml code I've used:
= link_to new_class_room_path, {:class=>'btn btn-primary'} do
%i{:class=>'icon-plus'}
%span
New Class Room
%a{:class=>"btn btn-danger", :ref=>"#", :style=>'width: 200px;'}
%i{:class=>"icon-trash icon-white"}
Delete
Any one can tell me what I am missing here ?
p.s: if I do not use icons, the button will appear normally with correct width
You've nested your text inside of your icons.
Instead of:
= link_to new_class_room_path, {:class=>'btn btn-primary'} do
%i{:class=>'icon-plus'}
%span
New Class Room
%a{:class=>"btn btn-danger", :ref=>"#", :style=>'width: 200px;'}
%i{:class=>"icon-trash icon-white"}
Delete
Use:
= link_to new_class_room_path, {:class=>'btn btn-primary'} do
%i{:class=>'icon-plus'}
%span
New Class Room
%a{:class=>"btn btn-danger", :ref=>"#", :style=>'width: 200px;'}
%i{:class=>"icon-trash icon-white"}
Delete