Bookmarklet to get full image path
I am working on a bookmarklet that gives the full path to an image when you click on any image on a web page. Then the image is uploaded to our servers and we do the business.
The script currently parses the attribute src
with jQuery, then has some dumb logic that usually works, but quite often it doesn't.
Now I could write ugly code to understand the URL better using regex and stuff, but I feel like there must be some better way to do this. Finding some way to emulate (like in firefox) "Right-Click => Copy Image Location" would be fantastic.
Here is the relevant js code I have (buggy, but it usually works). Any innovative ideas on how best to do this?
var imgsrc;
$("img").click(function() {
imgsrc = $(this).attr("src");
var url = document.URL;
if (window.location.pathname != "/") {
var pathLoc = url.indexOf(window.location.pathname);
url = url.substr(0, pathLoc + 1);
} else if (window.location.pathname.substr(0,1) == "/") {
url = url.substr(0, url.length - 1);
}
if (imgsrc.toLowerCase().indexOf("http://") != 0) {
imgsrc = url + imgsrc;
}
window.open("http://www.mycompany.com/whatever?imgsrc=" + imgsrc + "");
});
$("img").hover(function () {
$(this).css({'border' : '4px solid #ff0000'});
}, function () {$(this).css({'border' : ''});
});
a source to share
I believe most browsers will normalize the property (I mean the DOM property, not ). Therefore, you can try: SRC
getAttribute('src')
$("img").click(function() {
window.open("http://www.mycompany.com/whatever?imgsrc=" + this.src + "");
});
If that doesn't work, then I know the anchor tags have their properties normalized; this will definitely work: HREF
$("img").click(function() {
var fullSrc = $('<a/>').attr('href', this.src)[0].href;
window.open("http://www.mycompany.com/whatever?imgsrc=" + fullSrc + "");
});
a source to share