Here, at the ADAM offices, we recently had a 'developer play day'. This means that we can do whatever we want, with who we want and that for an entire day.
I decided to do some research on writing an new connector for Google Picasa.
Creating a button in Picasa
If we want to connect Picasa to ADAM, the first thing we need is a button in Picasa. Luckely for us, there is an API available.
In brief you need to do a couple of things:
- First off all, you should create an image for your button in Photoshop
- Second, you need to make a XML-based file to provide some information about that button.
| XML |
1
2
3
4
5
6
7
8
9
10
|
<buttons format="1" version="1">
<button id="ADAM/{1BAF11C1-4265-4ED8-9529-67EE4FA01714}" type="dynamic">
<icon name="{1BAF11C1-4265-4ED8-9529-67EE4FA01714}/ADAM" src="pbz"/>
<label>ADAM</label>
<tooltip>Upload to ADAM</tooltip>
<action verb="hybrid">
<param name="url" value="http://localhost/Adam.Picasa.Connector/Home/Adam"/>
</action>
</button>
</buttons>
|
- Then you need to give both files the same GUID as filename. Also do not forget to change the extension of your .xml file to .pbf
- Now you can create a zip file containing the Potoshop and the xml file. After the zip is created, you should change the extension to .pbz
- As a last step, create a html file that installs the button into Picasa. You can find an example in the included project
When you stick to these instructions, it should be quite easy to create an extra button in Picasa.
The result can be something like this: 
If you want more information about this, I suggest you read the Picasa Button API
Process the data from Picasa
Now that we have a button available inside Picasa, we can start writing some code. First, we need to create new asp.net (mvc) web application. This application is responsible for uploading all the data to ADAM.
I prefer asp.net mvc, so I created the Adam.Picasa.Connector application.
When you select some photo's in Picasa and click the ADAM button, it launches a new window that points out to your url that you filled out in the xml information file. In our case this is http://localhost/Adam.Picasa.Connector/Home/Adam.
Picasa generates a rss feed for you, and sends it through a post action to your page.
| XML |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
<?xml version='1.0' encoding='utf-8' ?>
<rss version='2.0' xmlns:photo='http://www.pheed.com/pheed/' xmlns:media='http://search.yahoo.com/msrss/'>
<clientlanguage>en</clientlanguage>
<channel>
<item>
<title>photo-057.jpg</title>
<photo:thumbnail>http://localhost:58837/abeef0560f301bf71bd43c55b1f47215/thumb/49e729790dc3e095.jpg</photo:thumbnail>
<photo:imgsrc>http://localhost:58837/abeef0560f301bf71bd43c55b1f47215/image/49e729790dc3e095.jpg</photo:imgsrc>
<media:group>
<media:content url='http://localhost:58837/abeef0560f301bf71bd43c55b1f47215/image/49e729790dc3e095.jpg' width='5616' height='3744' isDefault='true'/>
<media:thumbnail url='http://localhost:58837/abeef0560f301bf71bd43c55b1f47215/thumb/49e729790dc3e095.jpg' width='144' height='96'/>
<media:content url='http://localhost:58837/abeef0560f301bf71bd43c55b1f47215/original/49e729790dc3e095' width='5616' height='3744' fileSize='2007354' type='image/jpeg'/>
</media:group>
</item>
</channel>
</rss>
|
Now you can create an action on your controller that processes the rss and shows the necessary information on your page
| C# |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
|
[ValidateInput(false)]
public ActionResult Adam(string rss)
{
IEnumerable<ImageModel> images = new List<ImageModel>();
XDocument xmlDoc = XDocument.Load(new StringReader(rss));
images = from channel in xmlDoc.Descendants("channel")
from item in channel.Descendants("item")
select new ImageModel
{
Title = item.Element("title").Value,
ThumbNail = item.Element(XName.Get("thumbnail", "http://www.pheed.com/pheed/")).Value,
Original = item.Element(XName.Get("imgsrc", "http://www.pheed.com/pheed/")).Value
};
return View(images.ToList());
}
|
The result on your page is something like this:
Upload your pictures to ADAM
When we hit upload, we call the Upload action on our controller. This action will connect to ADAM, upload the files to the ADAM temp folder and save a new record.
| C# |
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
|
[HttpPost]
public ActionResult Upload(string[] paths)
{
Application application = new Application();
if (application.LogOn("Adam", "administrator", "password1234.") == LogOnStatus.LoggedOn)
{
try
{
foreach (var path in paths.ToList())
{
var tempFile = application.GetTemporaryFile("jpg");
SaveFileToTempAdamLocation(path, tempFile);
FileAddOptions options = new FileAddOptions { CatalogMode = CatalogMode.Alias };
Record record = new Record(application);
record.AddNew();
record.Classifications.Add(new ClassificationPath("Picasa_Uploads"), true);
record.Files.AddFile(tempFile, options);
record.Save();
}
}
finally
{
application.LogOff();
}
}
return RedirectToAction("Adam", "Home");
}
|
You can now see in ADAM that the selected pictures are inserted and uploaded
Sample Code
The article contains sample code project(s).
You must be logged in to view or download sample code.
Sign in now