search

maaaaz / webscreenshot

A simple script to screenshot a list of websites
GNU Lesser General Public License v3.0
654 stars 162 forks source link

Request of feature: URL with image #13

Closed jauharvp closed 4 years ago

jauharvp commented 6 years ago

It would be great if you can add feature to show URL with the screenshot

maaaaz commented 6 years ago

Hello,

What do you mean ? Like showing the screenshot URL directly in the image ?

jauharvp commented 6 years ago

Yes, exactly.

When I try to add screenshot for the report, I can show the URL as well and will catch easily when we refer the screenshot.

What do you think @maaaaz ?

Sorry for late comment.

MannyRamos commented 6 years ago

I can try and work on this.

maaaaz commented 6 years ago

@MannyRamos, thanks that would be really nice, I'm clueless in JS/HTML/CSS. I guess that you have to tweak the webscreenshot.js file with some PhantomJS API

MannyRamos commented 6 years ago

@maaaaz I was going to try and use the PIL library on python to actually edit the photo/screenshot because python is the only language I know.

maaaaz commented 6 years ago

@MannyRamos. Hum I don't think that it is the good approach. Editing the DOM by just appending the URL with a convenient font size on the top of the page and then screenshoting is the good way to do it.

424242424 commented 4 years ago

@maaaaz is this issue up for grabs?

maaaaz commented 4 years ago

@424242424 what do you mean ? if the asked feature is in progress ? unfortunately no. I'm open to contributions :)

424242424 commented 4 years ago

@maaaaz I mean, can I pick it up :). If it's not in progress, do you have any thoughts on how this should be done so I could get to work on it?

maaaaz commented 4 years ago

@424242424 sure you can pick it up !

With a first approach I imagine this feature as is:

  1. That can only work with the phantomjs renderer as the other ones, without a webdriver, cannot instrument a page content

  2. It should be an option, like --show-url, it won't be enforced by default when launching webscreenshot

  3. Upon a page grabbing, the URL is put inside the DOM with a proper font size and color, preferably at the top of the page, really close to the <head> or <title> tags

Or maybe a second approach like this would be better : instrument the image after capture and add the URL (https://github.com/maaaaz/webscreenshot/issues/13#issuecomment-412566673). So that could work independently of the chosen renderer.

Cheers.

jauharvp commented 4 years ago

@maaaaz @424242424 I missed your comments bros.

Any luck?

0xmilan commented 4 years ago

The easiest way is to just run a convert command to add the label: convert screenshot.png label:'<URL goes here>' +swap -append labeled_screenshot.png

More options at https://imagemagick.org/Usage/annotating/

subprocess is already imported, so we can simply do a subprocess.run(["convert", "..."]) after the screenshot is taken.

Let me know if this would work for you and I can test the feature and create a PR.

maaaaz commented 4 years ago

Hello @milangfx,

Really interesting, I would not have thought of using imagemagick. I see multiple advantages (notably the fact that it is not correlated to the renderer, hence compatible with all) but I have some questions :

Cheers.

maaaaz commented 4 years ago

Nevermind, I got my answers and I implemented that feature in the version 2.7.

Use the -l option (or --label), after ensuring that you have imagemagick installed: another screenshot with the URL on top will be created.

Let me know if it works or not for you.

Cheers.

0xmilan commented 4 years ago

Hello @maaaaz,

Thanks for implementing this so quickly. It works fine on my end, but I think 60 for the font size is a bit too much.

The label overhangs the screenshot when the URL is long: https_groups google com_443_a_python org_forum___forumsearch__with_label

maaaaz commented 4 years ago

Thanks for your feedback ! It might be a bit big (and overhangs), but that's something I wanted to be able to quickly see the URL while browsing screenshots.

maaaaz commented 4 years ago

I might add user options to specify the label size and background color.

0xmilan commented 4 years ago

Fair enough, the huge font makes it easy to read the URL at a glance. The -l option could set an integer to change the font size, with a default value of 60.

0xmilan commented 4 years ago

Thanks for adding the label options in v2.8. I think this can be closed.

maaaaz commented 4 years ago

Thanks