This morning I drove down a new coding rode- I’ve never done a Greasemonkey script, so with some help poking around ones I have and Dive into Greasemonkey — here is my crude Flickr CC Attribution Helper.
What is does is adds a box on the right side of flickr photo pages — only for photos with a Creative Commons License — some HTML you can copy and paste for a blog post.
I found an existing script Flickr Photo Link but that was meant to grab the entire image URL (mine is meant for a caption assuming you have already inserted an image into a blog post or web page). Also, that 3 year old script did not even work because it was not parsing correctly for the user name the way it does the XPath search on the <b> tag (looks like flick added a foaf attribute), but also, I did not like the way it stuck the code to copy in the comment text area which would get in the way of making comments.
But that script was a good start, and with a little bit of trial an error, I have the HTML being inserted in a text area on the sidebar. I have not yet mastered how to exactly place it using the flickr pages DOm structure, so it is hanging in the Tags content part. If someone better at GreaseMonkeying can help me move it say below the license area, I’d be a tali wagging coder.
And this is really set up for the way I write my photo links. I don;t just insert the image link from flickr; I download the image, upload to my blog, and then add after something like for say, this dreamy I’d like to be there now image:
|
1 2 3 4 5 6 |
<br /><small> <a title="Outlet on the Sound" href="http://flickr.com/photos/cogdog/3425479991/"> cc licensed flickr photo</a> shared by <a href="http://flickr.com/people/cogdog/"> cogdogblog</a></small> |
or as displayed:
cc licensed flickr photo shared by cogdogblog
So in some sense, this is hardwired to the way I compose my attribution, although, it does not take too much to edit the script. I may add as a default the embed code for the image itself from flickr, since that is the way people likely use images anyhow (I like to have them on my own server).
I should also add some javascript that selects all the text when the mouse clicks in the box.
This is really just a crude first cut at this script, more to see if it is of use (and heck, I will use it if no one else does). Give it a try and let me know what it needs http://userscripts.org/scripts/show/49395
UPDATE: With help form Patrick, the 0.2 version of the script now is placed better in the flickr sidebar. I added to the HTML you get the link to display the image and link to the source photo, and added script so when you click in the field, the text is automatically selected for quick copying
This is cool Alan – I will give it a workout when putting together a course I am working on. This will make it easy to attribute the photos I use.
I can’t believe I didn’t already have an “all-hail-cogdog” tag to go alongside the “all-hail-tony-hirst” one; this would be like the 5 thing at least tagged like that. Nice one!
I didn’t quite realise it, but I’ve been waiting for this for a long time. I just used it for the first time, and love it!
@Scott Leslie: That’s nice, but Tony is in a stratosphere of his own. Thanks, but it still needs some work- gotta figure out how to place it better, and make it copyable when you click the field
Alan,
Awesome! I love it when GreaseMonkey makes a wee niggling little task so much smoother!
Here’s a variation on your script that I think should place the textarea below the license info. It’s replacing what you have starting with getting the element id=”thetags”, does an XPath to get the p containing the Privacy info, and slaps the textarea into there instead. I feel a little dirty for putting a div inside a p, but I’ll likely live.
var liscP = document.evaluate(“/html/body/div[11]/table/tbody/tr/td[2]/p”,
document, null, XPathResult.FIRST_ORDERED_NODE_TYPE,
null).singleNodeValue;
if (liscP) {
var div_attrib = document.createElement(‘div’);
div_attrib.innerHTML = ‘CC Attribution String‘ + ‘cc licensed flickr photo shared by ‘ + usernick + ‘‘;
liscP.appendChild(div_attrib);
}
Ooops…I’m sloppy…XPath doesn’t necc. work…back to drawing board
@Patrick Murray-John: Yeah I just found that out while testing. I was worried too about such a hard coded path. If flicikr’s css used more ids than classes, it would be easier. It can slip below that whol chunk if it helps ir maybe I have to slip it in the image body area. I was also trying when I made it to perhaps isnert it as a link that when clicked would provide the chunk in a JS prompt() box.
This XPath seems happier:
“//p[@class=’Privacy’]”
Know what you mean about XPaths….they work great until someone changes their site design. I have a couple GM scripts that need revision every year or so as the site design changes. Usually, though, it’s really quick and easy changes. I suspect that the XPath above (looks like I was submitting it while you were writing your comment!) will be fairly easy to maintain. But then again I tend to be way overly optimistic about such things
Brian’s description fits: this is something I didn’t realize I needed until I tried it. I can’t believe how many times I’ve gone through the steps of attributing pics manually and never considered making it easier. I love the way you notice those kinds of things in your own work flow. CogDogMetaCognition.
I want to give credit where credit is due to say thanks for the help from the images I am about to use. I have only just started to use other peoples images so giving attribution was looking to be somewhat of a chore but it was still going to be worth the effort. I now am about to try this “Grease Monkey” script which sounds like it will make it a little easier of an effort for me. My new website http://polzeath.net is going to be my first site using images from Flikr and it should be up and running in a couple of days now, I only started this morning. Thanks for taking the time to write the script, I just have to try and work out how to use it. Cheers, Ozzy
That’s an old script and will not work. Get the new one which is a browser bookmarklet tool at https://cogdog.github.io/flickr-cc-helper/