Image Widget - show large image in fancybox style

First I must thank Jochem once again for pushing me to finally try to make my own solution.

Here we go. screencast http://www.marktold.com/screencast/fancybox_images.swf

I think the image widgets option to show an image in original size is cool. However having it open as a new blank window like in 1998 is a bit embarrassing.

Here is my solution I would like to share.

1) I downloaded fancybox version 2.1.3 from here http://fancyapps.com/fancybox/#license
2) Extracted the files and included the files in my own project.  I have a root folder MyResources where I have some general stuff. Split in images, scripts, styles -> so I had to change jquery.fancybox.css (css_changes.png) image pathes to my own hierarchie. -> MyResources.png
3) created fancybox.ascx with the following code

Had to add it as image - code paging got me an invalid code error on this editor sorry :-(

code.png

4) build my project and uploaded the whole stuff.
5) In the backend Admin - Settings - Advanced - Toolboxes  I have my own section where I add the fancybox.ascx (add_ascx.png)
6) now a client can select an image widget, choose to have original size shown and drag the fancybox.ascx widget to the page. I dragged it to the bottom of the page.

So now when clicked the images should open in fancybox style.

Markus

PS: Tried it first on master.master but then the sitefnity gallery would no longer work :-( so therefore this (might be clumsy) approach. 

Seems to work so far. Looking for feedback.

Markus


PS: Wished the image widget would do this automatically.

Here is the code. It worked when I split the code. Maybe it was just an hickup :-O

Hello Markus,

Thank you for the code and the video that you shared with us!

" ... having it open as a new blank window like in 1998 is a bit embarrassing." - true! The image widget and especially in combination with the fancy-box library is implemented long time ago in Sitefinity and unfortunately haven't been changed or updated so far.

However as your code includes a change in the fancy-box version (which you mentioned is not free) we should discuss whether and when we will upgrade and then we can benefit from your solution.

Thank you once again! Your Telerik points have been updated as a token of gratitude!

Regards,
Veronica Milcheva
the Telerik team

Dear Veronica

I guess it should not be to hard for you guys to come up with as a solution using the old already in SF integrated fancybox version.

Thank's for the points. I did not know they still existed.

Markus

In my post from 19th December I wrote:

QUOTE
PS: Please not that version 2 of the linked fancybox is NOT free for commercial use.
UNQUOTE

Can Telerik confirm that you cover the license since you are using version 2 now!!!!

Markus

This is my updated code I use now:

In the head of my .master

My fancybox.ascx

Of course you need the .css  

Markus

PS: Still looking forward to the Telerik answer concerning the license

Hello Markus,

i can confirm that we're using Fancybox v2.1.3 in 5.4, but I'm not sure what you mean by "confirm that you cover the license". Can you elaborate a bit please?

Dear Jen

How about looking at the image I attached in my last post sf_fancybox or here: fancyapps.com/.../

Markus

@Telerik

Any news if the license is covered if we use Sitefintiy or do we have to buy our own license!

This is important!!

Markus

Hello Markus,

We have bought a license, of course.
We'll switch back to the old version tough - we've received a lot of complaints with this version so far.

Dear Georgi

Thanks's for the information. I assume a license for all users of Sitefinity, right.

Will the switch back be in 6.0? 

Markus

Hello,

Yes. We'll switch back to the old one in 6.0, plus we'll fix any known issues with it with the switch.