.Mac web gallery theme

Hi,

With the announcement of iLife 08 yesterday, the .Mac web gallery was introduced. I had a quick look at an example is it's absolutely stunning. I love it. Have a look here. Make sure you slide your mouse over the picture and see it changes.

Here's the description from Apple.

It seems to me it's just plain html and a whole lot of javascript, including scriptaculous and sproutcore library.

I have no experience developing a theme for gallery, but it would be awesome if someone would port the .Mac web gallery as a gallery theme.

[img]http://images.apple.com/ilife/iphoto/images/iphoto_gallery03_20070807.jpg[/img]

[img]http://images.apple.com/dotmac/images/webgallery_hero20070807.png[/img]

That is such a beautiful theme ^_^

I would also love to see a port of it.

This would be a great theme if it could work like the mac gallery. Would be happy to help on it! Just PM me even though my experience is limited.

I have started briefly on getting skimming to work on the ice theme (i really like this theme in its native form and with some modifications I don't se it that far away to see a .Mac theme)

I personally think the functions should be adapted in the following priority:

1. Nice clean look (remove all unnecessary information and have it as a hidden part i.e. like the slider in the ice theme)
2. Skimming (It's really cool to "walk by" a whole album with just a mouse movement)
3. Implement switching between grid and matrix
4. Alter the thumbnail sizes with a slider
5. Carousel (more for it's cool appearance)
6. Clean photo preview with configurable photo information
7. Switch background colour
8. Everything else

As I said I have started working on skimming, but I don't really know how to address it. According to this note http://www.bigdumbdev.com/2007/08/build-better-gallery-skimmer-part-1.html the best way is to add all thumbnails in an album to one big thumbnail with all pictures in a series and just switch index in this file. However I don't know where/how I can rebuild the thumbnails for a whole album into one new pic.

I do think I'll manage to solve the "Apple" approach i.e. load all thumbnails and according to mouseOver event switch thumbnail. But for this I can't find the method that accesses all thumbnails in an album.

In the ice theme the following code is used to access album thumbnails from picture view.

{assign var="microThumbsColumns" value=$theme.params.MicroThumbsColumns}
{assign var="microThumbsSize" value=$theme.params.MicroThumbsSize}
{assign var="maxMicroThumbs" value=$theme.params.maxMicroThumbs} 
{g->callback type="core.LoadPeers" item=$item|default:$theme.item
    windowSize=$windowSize|default:$theme.params.maxMicroThumbs    
    addEnds=false loadThumbnails=true}

However this access thumbnails from an hierarchical higher level, I wants to access the picture thumbnails from album view..

That works great!

Everything except css change and carousel is now implemented. (Reflection is fixed but not enabled since then thumbnail resize does not work then).

The only thing we need now is a rewrite of the css and rearage the items (new navigation images is also needed). If you are interested in helping please pm me.

All suggestions are welcome as well.

erlis - you have done a great job porting the .mac gallery theme! It runs pretty slow for me (Im in California) but it is super slick. Would you mind making it available for download?

well id love to help but need more to go off of. also i dont see how copyrights affect this GPL code

i would be glad to help out on this project if i can. i am pretty good with CSS.

This might be interesting for the caroussel part:
Please, have a look at the menu:
http://www.loroma.com/loroma/movie.faces
I guess it's implemented with the java-script/ajax framework dojo:
http://en.wikipedia.org/wiki/Dojo_Toolkit

Oh, I'm sorry, but the site should be up and running again now. http://erlis.se/~erlis/gallery/gallery2/main.php?g2_itemId=42

erlis,

What do you think about a release of the theme? What parts do you think are exactly copyrighted material of apple?

The css styles are lacking ... what? Are they in a somewhat chaotic disorder at the moment, or aren't they crossbrowser compatible?
The images are mostly png icons I guess. Though, I didn't look over the theme, yet.
I'm new to gallery2 themes, too. But I'll try to look into this theme, anyway.

I already edited some styles in Firebug, to eliminate the scrollbars, and make the mosaic "elastic".

http://erlis.se/~erlis/gallery/gallery2/main.php?g2_itemId=81

[...]
<td align="left" width="40%" valign="top">
      <div class="gsContentDetail gcBorder1" style="padding: 5px;">
            <div class="gbNavigatorMicroThums">
                  <div style="overflow: auto; width: 100%; height: 100%;">
                        <table cellspacing="0" cellpadding="0"> [...]

Here you can see a screenshot:
http://ggserve.de/pub/screenshots/GIMP/g2_itemid81.jpg

Jacobdeane: Thanks! That would be great!

I did try to change the div style for the matrix view, but it doesn't really work in firefox.

What we whatn is to have the "Mosaic" window at a fix size but change the numbers of rows according to thumb sizes, we also wants to show all thumbnails for the whole album in this view (I'll look in to this part).

Cause what we are trying to achieve is a port of Apples gallery http://gallery.mac.com/emily_parker#100550&view=mosaic&bgcolor=black&sel=0 And as you can see is the screen divided into two areas one with the grid and one with the currently highlighted picture..

We'll also need to get the "Color picker" to work (a javascript updating the css should be enough).

And a good aproach to ajax implementations to replace the "active" picture with the "clicked" one..

Perhaps I'll manage to export the theme till Wednesday and publish it trough a svn so wee all can share our modifications any suggestions on a good place to publish??

As I see it there are still a lot to do and unfortunate I don't really have the time to do all of it myself.

The carousel should however be easy to implement, using the scripts published here..

Any name suggestions?? For the theme?

So..

Now the theme is "published" http://trac.cz/trac/pear

To use the theme do a

cd <gallery>/themes; svn co http://trac.cz/svn/pear

and activate the theme in gallery's plugin panel.

The theme is originated from the ice theme.

Please help me with descriptions and so on on the trac.

Have created two milestones where RC1 is what least have to be done before we can create a real release. Feel free to comment and add suggestions.

Milestone: RC1

* New images.
* CSS update (mimic the real look from Apple).
* CSS modification for lytebox (image click).
* Color picker implementation (should just be a js that modifies the inline css).
* Session saver for slider/color picker (js that writes to a cookie??).
* Remove unnecessary configuration options.

Milestone: RC2

* Carousel view.
* Ajax requests.

Sorry for posting this novice question:

I really like the theme, so I had tried downloading files of this theme and uploaded them (with the file/directory stucture posted on the website) onto my gallery's theme folder, but it simply couldn't work. Does it have anything to do the file name (I tried placing all these diles under the 'pear' theme name, but my admin's plugin page was totally messed up; and only when I deleted the 'pear' theme then the normal plugin page was accessible again). Would appreciate if any expert could help offer me some instruction as to correctly install this great theme!! Many thanks!!

New version..

Features:

• New images
• Color-picker
• Cookie save of image size and color-picker value.

PLEASE help me to update the css for the gcBackground1 so it supports scrollbars, so we can release this theme..

I'm sorry the permisson issue should be fixed now. Beware, this is still in beta..

Send me a PM if you need a commit account in svn..

cvos: Reflection is already implemented, but disabled due to problems with the image resize.. As soon I'm happy with the rest of the layout I'll update the reflection and even fix an option to enable/disable this feature..

What do you mean by open source? Isn't a SVN world readable open source enough for you??

jacobdeane: Could you please produce images for the color picker and size slider aswell? Then we finaly can release a beta version of this theme..

Erlis, first, great job on the Theme, keep up the good work.

I still can't get the CVS to work properly, and I'm reduced to using curl to download the thing manually from your production server, UGH! I wish I could help you more, I have a version of this up at http://tehgoat.com/gallery/, and I can see it's coming along nicely. I see what you mean about the grid view I think. Are you talking about the scaling issue?

Earley

Hi, Erlis:

Thanks for the hint. However, could you explain what "# svn co" meant? (sorry again for the novice question 'cause I really love to adopt this great theme you've created)

I then tried again downloading all files from http://trac.cz/trac/pear/browser (see pear-1.jpg) and uploaded them into my gallery2/themes/pear. However, when I accessed my admin's plugin page, the original page had turned into something very similar to your website (see pear-2.jpg). I figured that I must have done something wrong as my plugin page was back to normal when I totally removed the /themes/pear folder.

Your kind direction is highly appreciated. Many thanks in advance!!

-bhchen

now it works !!! thanks for that Erlis

Yes, I have now completed everything except new images for the slider and color-picker (still needs help with this) and configure options. So when the images are done I'll remove "all" configure options and release this theme as RC1 (release candidate 1).

Good work!

I have adapted your images.

But they are not 100% working...

Track right is missing..
Knob is not entirely transparent..

And the colorpicker radiobuttions are not working in one big png, I'll need one png for each color.

I have updated the zip file with hopefully fixed images - let me know if they still don't work!

http://www.jdpictures.co.uk/files/icons.zip