Swank Xibit (media gallery)

Posted: Wed May 11, 2011 6:29 pm

Well, I've been battling over whether or not to announce my first module... but here I am.

I call it "Swank Xibit".

First, and foremost, I want to thank Jonathan Stern (a.k.a Jestrella) for his hard work, time and brilliance with iGallery. I used his work as a guiding light in my quest to make a gallery capable of handing major media types and appeasing my wife. Without his work on iGallery, It would have taken me ages to cross some of the bridges that "seemed" impassable. Again, Thank You Jonathan!

Also, to all the "salty dogs" who've helped answer my questions while working on this project... Thank you! (you know who you are)

On with the show...

Requirements: (as of now)
- Php 5.2.0+
- Javascript
- Flash
- Jquery 1.5+ (possibly 1.4.2 but not tested)

What is Swank Xibit?

A) It is a media gallery.

What types of media are supported?

A) It "currently" supports:
- Audio: mp3, wma, m4a
- Video: wmv, mp4, swf, mov, rm, flv, vimeo, youtube
- Image: jpg, gif, png

Will the gallery create video thumbnails?
(currently writing under FFMPEG 0.6.1 - Latest stable)

A) If you have access to FFMPEG... you will be able to create video thumbnails. If you do not have access to FFMPEG... it will use the generic thumbnails.

A) At this point, no. In order to create video thumbnails, you would have to have access to FFMPEG and it's functions which most shared accounts don't have access to due to it's consumption of processing power. Since I'm on a shared server, I don't have access to FFMPEG in order to write in the functions for it for those who do have access to FFMPEG... Sorry. (I'm still working on getting vimeo and youtube thumbnails though)

Why is javascript a requirement?

A) This gallery is HIGHLY laced with jquery and is the basis in which it operates.

Why is php 5.2.0+ required?

A) json_encode was introduced with it and I use it for transporting data to and fro.

So how does Swank work? Well... simply put... ajax. This media gallery lives and breathes ajax calls and in doing so... doesn't load new pages. It only loads the requested data in the place holder area for the end user. This cuts down on the time the end user must wait to see the data they are requesting.

Ready to see it in action?
(bear in mind this module is still under HEAVY development and some functionality isn't available yet)
I will leave this open while I'm NOT working on the module. It will be closed any other time. [ Only registered users can see links on this board! Get registered or login! ]

So why announce something that isn't finished yet?

I'm trying to gauge interest in this module and get feedback on things I haven't thought of yet. Seeing how the iGallery topic has 4000+ views... I'm guessing this type of module is long overdue.

Criticism, thoughts, suggestions welcome. I'm all ears.

Administration Teaser

Screenshot (frontend):

Admin control bar (backend):

Add album page (backend):

Upload videos (backend):

Add youtube links (backend):

Posted: Thu May 12, 2011 7:58 am

absolutely awesome, looks great; nice work man! Wink

Posted: Thu May 12, 2011 8:04 am

It's getting there... still a lot to be done before I'm satisfied with it... but the basic functionality is out of the way.

The bigger question though... would you get use from this type of module??

registered · Posted: Thu May 12, 2011 2:00 pm

Really nice work... Btw, thanks for the compliments Embarassed

Posted: Thu May 12, 2011 2:07 pm

jestrella wrote:

Really nice work... Btw, thanks for the compliments Embarassed

Sorry for having the site down ATM, I'm working on the lightbox... and... I take no credit for some of the way this gallery works. If it hadn't been for you... I don't know how I would have even dreamed up the way some of this would have worked. (i.e. the iConfig function... great stuff there man)

I've also credited you within the module where I've used very modified or exact functions from iGallery. (although most everything has been touched in one way or another)

I tip my hat to you sir... you started this. Cheers

Posted: Thu May 12, 2011 2:11 pm

Hey, stop it. Not a big thing Laughing

Just one recomendation, the name, is weird and hard to remember/type. I think you'll need a more attractive one!

Posted: Thu May 12, 2011 2:21 pm

Oh how did I struggle with the naming... Here's how it came about though

Swank:

–noun
1.
dashing smartness, as in dress or appearance; style.
[ Only registered users can see links on this board! Get registered or login! ]

Exhibit:

–verb (used with object)
1.
to offer or expose to view; present for inspection: to exhibit the latest models of cars.
[ Only registered users can see links on this board! Get registered or login! ]
------------

Put together.... "Dashing Exhibit" or "Dashing Gallery" (Exhibit is a synonym of Gallery) I thought it fit the bill pretty well even though it was a bit out of the ordinary... although... I'm not really an ordinary thinker Wink

Posted: Sat May 14, 2011 4:32 pm

jestrella, sorry for the slight OffTopic

but you may want to check out your signature line... I think you meant .com rather than .con. Wink

Posted: Sat May 14, 2011 7:20 pm

Oops... Thanks for the heads up... Corrected it!

Posted: Sun May 15, 2011 10:04 am

This is awesome, a working Gallery is the one thing holding me back from using RN on customers sites. I would be willing to pay for a module like this!

Posted: Sun May 15, 2011 4:22 pm

Very nice!
The mp3's wouldn't work for me, presumably they are just dummy/empty files?

Posted: Sun May 15, 2011 6:38 pm

Guardian2003, they work fine for me running FF 4 and IE 9 except for the WMA because I do not have the plugin for either.

Posted: Mon May 16, 2011 2:18 am

I'm using FF4 and latest Operwith Ubuntu, I get the same results in both, when I click any of the sound files they just cycle through all the files put no sound, except in Opera where I get about three bars of Knight Rider.
More than likely it is my setup that's the problem.

Posted: Mon May 16, 2011 7:14 am

Thanks for bringing that to my attention Guardian... I've tried testing extensively with FF4, 3 ; IE 7,8,9 ; Chrome (latest) as best I can to ensure they all work correctly... but I don't have ubuntu on my laptop (yet) so I can't test under that.

Do you happen to have a download helper installed on that pc? Just curious if it's possible the downloader is pulling the files rather than the player playing them.

@mars... I'm glad you like it. I'm "trying" to have it completed by this fall. Still working on whether or not it should have a commenting system as well the ability for end users to upload their own files. (will take a lot more time to implement that)

Posted: Mon May 16, 2011 8:35 am

I disabled all my non default FF plug-ins and restarted FF and here is what I'm able to reproduce;
Audio;
FF and Opera; WMA plays fine when clicked, and once the file loads and starts to play, an option appears to 'open' the file via a number of different media players I have installed. The file plays without using these options through the browser as it should / would be expected.
The other 2 audio media types don't play any sound and after a few seconds of waiting for the file to load, the browser appears to skip the file and move on to the next one automatically. What is interesting is that if I select any of the audio files except the WMA one, when it starts to cycle through all the available audio files, it even skips the WMA file. It appears almost as if there is some sort of buffer delay before the file is told to stream but the buffer delay isn't quite long enough to get enough of the file before it can start to stream and thus, moves on to the next file as though it couldn't be found. In the case of selecting (as an example) the mp3 file, by the time it decides to skip it, clears the buffer and starts to re-buffer for the wma file, the delay has expired and won't play the wma even though it plays if selected first.
I hope that makes some sort of sense.
Incidentally, I have mp3's streaming on one of my sites so I don't think it's my browser not handling the mp3 file correctly but I don't have any m4a files I can test with. I also recently set up a web site for a Radio station that streams mp3 via ShoutCast and that plays fine.

Video, pretty much the same sort of scenario for me.
WMV plays fine (in FF and Opera) the other two don't. I do have FLV files which play fine via both browsers if I select the file and do an "open with" but I'm unable to test mp4 because I do not have anything with that file type.

As an afterthought, I tried Chrome and that plays all the audio and video files perfectly so now I don't have a clue Sad

Posted: Mon May 16, 2011 8:55 am

Hrm... thanks for the new headache Wink

/sarcasm. Seems odd. I haven't tested with Opera which may need some looking at. I'll give it a shot later this evening to see if I can reproduce it with it. Maybe a problem with the way the links are built/handled.

Side note.... have you ever had any issue with jwPlayer playing files on your pc? Sounds like all the files you're having issues with are played via jwPlayer and that is the common ground I can think of so far.

Posted: Mon May 16, 2011 10:15 am

I cannot say I have ever used jwPlayer but a quick look at their website seems to indicate this is a server side player. If that's the case then the problem may well be how my specific browsers (FF and Opera) are handling the Flash part of the player. It looks to me like jwPlayer is designed to serve the media via flash unless the browser can handle the HTML5 related media tags - possibly why Chrome is handling it better (for me at least) since it is the most compatible with HTML5.

I think before you go diving into the code, we really need to get more feedback from montego or others who are using Ubuntu/Linux to see what happens for them.

Posted: Mon May 16, 2011 10:51 am

Guardian2003 wrote:

I think before you go diving into the code, we really need to get more feedback from montego or others who are using Ubuntu/Linux to see what happens for them.

Agreed! I just can't see how FF4 would be giving you issues... it's what I've developed this under specifically.

Posted: Sat May 21, 2011 2:58 pm

Commenting/rating system.

Screenshot:

Posted: Sat May 21, 2011 3:58 pm

Very Nice killing-hours... This is going to be one heck of a gallery....

Posted: Sat May 21, 2011 6:07 pm

nuken wrote:

Very Nice killing-hours... This is going to be one heck of a gallery....

Thanks! Not sure how everything will work out in the end because I'm learning things as I go along. But so far so good. Wink

Posted: Tue May 24, 2011 11:18 am

Posted so I can follow this topic's replies.

Nice work so far! Looks great and per the features it would be something I would most definitely be interested in.

As of now, I use Coppermine for photos and Video module for my videos. It would be nice to have an all-in-one module.

Posted: Tue May 24, 2011 11:24 am

You're not the only one who wants it... I did to but there wasn't anything and I wasn't about to cave in to coppermine.

As a dub purpose... this will also get my wife to backup our photo's and videos so we have them elsewhere instead of all in the house. Almost lost them on a hard drive failure once... and then the house caught fire. Avoided both times but how many times can we dodge a bullet?

Thanks for your interest... I'm working my tired lil fingers off on it. Wink

Posted: Tue May 24, 2011 11:30 am

Questions:

What kind of layout options can we expect? i.e. # of rows/columns per album, color schemes etc.

Sizes of thumbnails can be changed edited or manually linked to?

If we have access to ffmpeg, will an option be included to turn it on/off and give path to ffmpeg module?

What image processor will be used for thumbs etc.? imagemagik, netpbm, GDlibrary or user choice?

It looks like you are using litebox(or am I mistaken), is there a reason you chose it over colorbox that is already included in Raven? Also, will there be options to control the features when using litebox?

Posted: Tue May 24, 2011 11:52 am

Very good questions... some of which I didn't want to give details away as of yet. (to hold back a lil mystery about it...) However, since you've asked.

(1) The rows / columns will be editable in the gallery settings (admin). I still have to work out some of the fail safe's for it though because of the way the pagination works.

(2) Size of thumbsnails will play a part in #1 so it will be possible to have smaller thumbnails but the fail safe's have to be worked out.

(3) FFMPEG was the BIGGEST let down for me. I searched hi & low for ANY possible way to do it (video thumbnails) without FFMPEG but it doesn't seem possible. I don't have access to it because I'm on a shared server so I can't write the functions in for those who do have access to it... or that would have been done long ago. I really want those options there very badly... I just don't have access to a server with it available.

(4) I'm using phpthumb for the image thumbnail generation. It's included within the module and the functions are already written. The user doesn't have to set anything up... just upload the gallery... set the database options... and off to the races.

(5) I'm using a lightbox of sorts... however, the lightbox has native support for some of the video formats... plus I modified it to support some of the other video formats. I chose this lightbox because of it's ease of use & native support for some video formats. It's also included within the module with no real user changes needed.

(6) The pagination has the ability to be customized to w/e color scheme fits the site... however, it requires a css edit and I'm going to write in a field to add the scheme "name" to the database so that it can be chosen from the admin panel. (I'll provide instructions on how to make it happen. Takes a few mins to set the css.. nothing major)

(7) The top bar's for the controls are custom images I created. I'll provide those .psd's with the module so they can be edited to match the site... or if you (the end user) is decent enough at image creation / css... then you can create your own and place them in place of the ones I'm created.

Hopefully that helps to clarify things for you... I know I was somewhat vague with my initial post... please forgive me for that.