How do I set up an image gallery both with thumbnails and the

7/6/2011 10:26:40 PM

Finnur

Total Posts 34

View Posts

How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Hello,

I have been using the Simple folder gallery on my websites without any issues. Now I want to set up an image gallery with the standard image gallery (not the simple folder version). I am quite happy with the thumbnails display and the picture viewing capability. Is there some way to allow full-screen display of the pictures? I know I can do it with the Silverlight slideshow but then a lose the standard thumbnails of the image gallery.

So I wondered if it is possible to have two instances of the image gallery, one without and one with the Silverlight slideshow enabled and let them point to the same set of images. Then I could make a page with the standard thumbnails with a link to another page with the Silverlight slideshow instance.

I would even be ready for some minor manual editing of the mojoPortal database tables to make this happen. The best solution would be if the standard image gallery would provide this out of the box.

7/18/2011 3:12:01 AM

IndigoTea

Total Posts 355

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Finnur,

Are you looking for a layout more like this? BWB 4th of July (warning - pinup photography, may not be completely safe for work) - it's not quite the latest version of the custom gallery I created for mojoPortal, but it's 95% of it. I've still got a few refinements I want to add before I release it in Sept.

7/19/2011 10:37:48 PM

Finnur

Total Posts 34

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Yes, but I was more thinking about full-screen slideshow. Is that possible with your solution?

7/19/2011 10:57:10 PM

IndigoTea

Total Posts 355

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

With some additional coding, yes. Right now, the larger image displays according to size ratios set in the module; you'll notice the link at the top for start/pause slideshow, which allows for a slideshow in the page itself. Would you want a full-screen (lightbox?) slideshow in addition to the existing functionality?

7/20/2011 7:39:29 AM

Finnur

Total Posts 34

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Yes, I did try the slideshow you have on the page and it works fine. In addition I would like an option for the viewer to view the images full-screen. The Silverlight option in the Image Gallery provides this nicely, but then you lose the full-page thumbnails view.

I could work around this by uploading each picture gallery twice, once with the Image Gallery standard settings and again with the Image Gallery with the Silverlight setting on. Then I could link to the Silverlight version from the page with the standard version of the gallery. But this does not seem an optimal solution to me :)

See a nice gallery implementation with slide show option here at BlueMelon: http://www.bluemelon.com/finnur/kjartansmotkribor%C3%B0tennis6--7-november2010#page-0/photo-970262

I know not everyone has Silverlight but as all page viewers can view the pictures from the thumbnails that does not bother me much.

Is this development you are doing a part of the open source version of mojoPortal or is this an addition to you hosting package?

7/20/2011 10:44:20 AM

Jamie E

Total Posts 1203

View Posts

Help support mojoPortal!
Add-on modules

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

The link you provided is to a dedicated photo hosting web site with their own custom photo handling/slideshow software, and mojoPortal will probably never have a gallery that can compete with a site like that. We did recently upgrade from Graybox to Colorbox, which supports a lightbox slideshow mode as an alternative to the Silverlight slideshow (but it's not full screen). You seem to have some pretty specific requirements, so have you considered signing up with that Blue Melon site for your photo hosting?

7/20/2011 11:48:09 AM

Finnur

Total Posts 34

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Yes, I agree that it is not reasonable to expect mojoPortal image gallery features to compete fully with a dedicated image gallery site.

However mojoPortal has all the image gallery features I need, just not packaged togother to suit my needs.

BlueMelon as good as they are, do not have the CMS features that I need. MojoPortal does the CMS part very well. I did try to embed the gallery pages from BlueMelon into content pages in mojoPortal but that did not work well, navigation was awkard and it did not seem like a good fit.

As I am a professional ASP.NET and Silverlight programmer myself, I could probably modify the SlideShow2 Silverlight control or even add a module to mojoPortal to suit my needs. If I find time to do that, I would surely make that freely available to any mojoPortal user.

Thanks for the link to the Colorbox page. I see that maxWidth and maxHeight can be set to 100%. I wonder if the mojoPortal wrapper limits that. 100% of the current browser window is very close to full-screen if the window is maximized.

BTW my project (non-commercial) is a community site for table tennis fans in Iceland. The plan is to include picture galleries of tournaments and links to YouTube videos in addtion to some commentary.

7/20/2011 11:49:07 AM

IndigoTea

Total Posts 355

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Finnur,

The image gallery in use at Babes with Blades, and other clients of mine, is a custom module that works within MojoPortal. It isn't reliant on a third-party hosting service of any sort; it simply integrates into your MojoPortal implementation the same way as any other module would. It won't be part of the open-source code base; I've just released my first commercial plug-in for MojoPortal, the Ad Manager, and the MegaGallery (still deciding if that will be the release name) will be the second commercial module that I release for mojoPortal. I am offering an advance copy of the MegaGallery to anyone purchasing the Ad Manager this month (thru July 31).

As far as your requirements are concerned; do you want the thumbnails to be contained in the full-screen view, or would it work for you to have thumbnails and medium-sized image on the page, with an option to see a larger image in full-screen, with the ability to have previous/next navigation?

My goal with the MegaGallery was to create a non-Silverlight, non-Flash gallery that would give the ability to manage thousands of images, which it's currently doing for BWB, and smaller photo collections on other clients.

7/20/2011 12:32:03 PM

Jamie E

Total Posts 1203

View Posts

Help support mojoPortal!
Add-on modules

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Hi Finnur, thanks for the offer to contribute. If you want to make code enhancements to the Image Gallery module, the source code is all available to you. To me your proposed changes sound like a good enhancement for mojoPortal, but you should probably wait for Joe Audette to weigh in here, to make sure that he is interested in including this enhanced functionality within the mojoPortal core. If he is, you'll need to send him a signed contributor agreement, and then you can work to improve the Image Gallery module to meet your needs, and if Joe approves your changes, he'll incorporate them into the core.

If Joe does not want your changes to be part of mojoPortal itself, you can always clone the Image Gallery feature and make changes to that for your own use. That way you will avoid forking the code and can continue to upgrade in the future.

It does sound like IndigoTea may have a very nice solution as well, if you're interested in going the add-on feature route.

Jamie

7/20/2011 1:26:50 PM

Finnur

Total Posts 34

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

I don't see any need for thumbnails in the fullscreen view.

The possibility to pause and start the slideshow is a must. Also being able to step through the pictures with a next/prev link or a right/left arrow button.

My plan is to upload the pictures in resolution something like 2000 x 3000 pixels so most of the times downscaling would be needed for fullscreen view. I am not sure whether the down-scaling should be performed server og client side.

Looking more closely at the BWB page I am impressed with the functionality it has. If it had the full-screen slide show possibility, buying it at a similar price as the Ad Manager would be a no brainer for me, even for a non-commercial site.

Note however that my needs might not be typical. I am a photography amateur who is really interested in making, sharing and viewing pictures.

Professional photographers seem to be reluctant to show their work fullscreen. Many normal users seem to be quite happy with limited galleries like Facebook provides. Photo gallery sites like Flickr and BlueMelon do however see reason to provide full-screen viewing of pictures for those interested.

I am quite happy to see some third party module marked develop for mojoPortal.

Yes, I know that Joe keeps a rather tight control on what goes into mojoPortal. I believe that it is one of the reasons for the high quality of mojoPortal. It has a very coherent set of features that work well together. Products that are modified to satisfy every ones needs, usually end up not being useful to anyone because of complexity and incompatible features.

Thanks guys for your responses, you have been very helpful. I am going on a vacation for a few days now, so I may not be able to respond quickly but I will follow what IndigoTea will come up with and check the responses here.

7/20/2011 8:28:05 PM

IndigoTea

Total Posts 355

View Posts

Re: How do I set up an image gallery both with thumbnails and the possibility of a fullscreen slideshow?

Currently, the way the MegaGallery (maybe mGallery - what do you think?) works, is that when the module is added to the page, one of the configurable options is to set a max width/height for the larger image (default is 600px). When images are uploaded, they're automatically resized to not exceed the max width/height, before being loaded. It wouldn't take too much more to add an additional method to upload a "full-screen" size as well, with a "max-width" setting for full-screen size.

It sounds like you'd also like to see an option for "download full resolution"? I'd make that a per-module setting, so that if the site owner wants to offer availability of hi-res images, they have the ability to do so. Since access to modules can already be set by rights and roles, that means that premium content can also be controlled by rights/roles security. I'm looking forward to seeing what Joe does with Site Membership Pro - that has some potential for integration; one step at a time, though!

I already have the ability for a custom watermark built-in; it's actually integrated into the larger image via GDI+. Depending on how big they choose the watermark to be, could control how much of a "preview" it is.

The images are stored in the database, in order to improve security for the image owner. When I first created it, I had someone who wanted to be a "smarty" tell me he could just traverse the site to find the un-watermarked image. When I explained the technique I had chosen to use, he was definitely pouty. :-D

Given that this has even more functionality than the Ad Manager, I'd planned on making the price a bit higher, but I haven't determined what my price will be. I'll probably have an introductory price on it - have to switch to the "money" side of my brain to process that.

Have a great vacation, and thanks for your feedback!