Merge branch 'master' of ssh://odb/home/gitroot/album

gucci/assets/album-ext.js

@@ -1,259 +0,0 @@
-Position.includeScrollOffsets = true;
-
-var Engine = {
-    detect: function() {
-        var UA = navigator.userAgent;
-        this.isKHTML = /Konqueror|Safari|KHTML/.test(UA);
-        this.isGecko = (/Gecko/.test(UA) && !this.isKHTML);
-        this.isOpera = /Opera/.test(UA);
-        this.isMSIE  = (/MSIE/.test(UA) && !this.isOpera);
-        this.isMSIE7 = this.isMSIE && !(/MSIE 6\./.test(UA) && !this.isOpera);
-        this.isMSIE6 = this.isMSIE && !this.isMSIE7;
-        if (document.childNodes && !document.all && !navigator.taintEnabled)
-            Engine[!!document.evaluate ? 'isSafari3' : 'isSafari2'] = true;
-    }
-}
-Engine.detect();
-
-if (Engine.isMSIE){
-    try {
-        document.execCommand("BackgroundImageCache", false, true);
-    } catch(e) {
-        // ignore
-    }
-}
-
-Position.getPageSize = function() {
-
-    var xScroll, yScroll;
-
-    if (window.scrollMaxX) {  
-        xScroll = window.innerWidth  + window.scrollMaxX;
-        yScroll = window.innerHeight + window.scrollMaxY;
-    } else {
-        xScroll = document.body.scrollWidth;
-        yScroll = document.body.scrollHeight;
-    }
-  
-    var windowWidth, windowHeight;
-    if (self.innerHeight) { // all except Explorer
-        windowWidth = self.innerWidth;
-        windowHeight = self.innerHeight;
-    } else if (document.documentElement && document.documentElement.clientHeight) { // Explorer 6 Strict Mode
-        windowWidth = document.documentElement.clientWidth;
-        windowHeight = document.documentElement.clientHeight;
-    } else if (document.body) { // other Explorers
-        windowWidth = document.body.clientWidth;
-        windowHeight = document.body.clientHeight;
-    }
-    // for small pages with total height less then height of the viewport
-    pageHeight = Math.max(windowHeight, yScroll);
-
-    // for small pages with total width less then width of the viewport
-    pageWidth = Math.max(windowWidth, xScroll);
-
-    return {
-        page: { width: pageWidth, height: pageHeight },
-        window: { width: windowWidth, height: windowHeight }
-    };
-}
-
-Position.scrollX = function(){
-    return (window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0);
-}
-
-var Loader = {
-
-    _assets: $H({}),
-    _checkInterval: null,
-    _options: {},
-
-    _update: function() {
-
-        var allLoaded = true;
-        Loader._assets.each(function(a) {
-                if (!a[1].complete && a[1].image.complete) {
-                    a[1].complete = true;
-                    a[1].completed_at = new Date().getTime();
-                    if(a[1].options.onComplete) {
-                        a[1].options.onComplete(a[0]);
-                    }
-                }
-                if (!a[1].complete && !a[1].image.complete) {
-                    allLoaded = false;
-                }
-            });
-        if (allLoaded) {
-            clearInterval(Loader._checkInterval);
-            Loader._checkInterval = null;
-            if (Loader._options && Loader._options.onComplete) {
-                Loader._options.onComplete();
-            }
-            Loader._options = null;
-        }
-    },
-
-    initialize: function() {
-        var options = arguments[0] || {};
-        Loader._options = options;
-    },
-
-    cacheOrLoad: function(url) {
-        var options = arguments[1] || {};
-        if (this.isLoaded(url)) {
-            if (options.onComplete) {
-                options.onComplete();
-            }
-        } else {
-            this.load(url, options);
-        }
-    },
-
-    load: function(url) {
-        if (Loader._assets.get(url)) return;
-        var options = arguments[1] || {};
-        var a = { };
-        a.image = new Image();
-        a.image.src = url;
-        a.complete = false;
-        a.options  = options;
-        a.loaded_at = new Date().getTime();
-        if (!Engine.isSafari2) {
-            Event.observe(a.image, 'error', function() { Loader.error(url) });
-        }
-        Loader._assets.set(url, a);
-        if (!Loader._checkInterval) {
-            Loader._checkInterval = setInterval(Loader._update, 10);
-        }
-    },
-
-    error: function(url) {
-        var asset = Loader._assets.get(url);
-        asset.complete = true;
-        if (asset.options.onComplete) {
-            asset.options.onComplete('assets/empty.gif');
-        }
-    },
-
-    stats: function(url) {
-        return (Loader._assets.get(url)._complete ?
-                (Loader._assets.get(url)._completed_at - Loader._assets.get(url)._loaded_at) : null);
-    },
-
-    isQueued: function(url) {
-        return Loader._assets.get(url);
-    },
-
-    isLoaded: function(url) {
-        return (Loader._assets.get(url) && Loader._assets.get(url).complete);
-    },
-
-    remove: function(url) {
-        Loader._assets.unset(url);
-    },
-
-    reset: function() {
-        Loader._assets = $H({});
-    }
-};
-
-Event.localPointer = function(event) {
-    var p = [Event.pointerX(event), Event.pointerY(event)];
-    var element = arguments[1] || Event.element(event);
-    var e = Position.page($(element));
-    return [
-        p[0]-(e[0]+(window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0)),
-        p[1]-(e[1]+(window.pageYOffset || document.documentElement.scrollTop  || document.body.scrollTop  || 0))];
-};
-
-Effect.HScroll = Class.create();
-
-Object.extend(Object.extend(Effect.HScroll.prototype, Effect.Base.prototype), {
-
-        initialize: function(delta) {
-
-            this.scrollStart = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
-     
-            var w = Position.getPageSize();
-            if (this.scrollStart + delta < 0) {
-                delta = -this.scrollStart;
-            }
-            if (this.scrollStart + delta > (w.page.width-w.window.width)) {
-                delta = (w.page.width-w.window.width) - this.scrollStart;
-            }
-            this.delta   = delta;
-
-            this.start(arguments[1] || {});
-        },
-
-        update: function(position) {
-            Position.prepare();
-            window.scrollTo(this.scrollStart + (position*this.delta), 0); 
-        }
-    });
- 
-Effect.HScrollTo = Class.create();
-
-Object.extend(Object.extend(Effect.HScrollTo.prototype, Effect.Base.prototype), {
-        initialize: function(scrollEnd) {
-            this.scrollStart = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
-    
-            var delta = scrollEnd - this.scrollStart;
-            var w = Position.getPageSize();
-            if (this.scrollStart + delta < 0) {
-                delta = -this.scrollStart;
-            }
-            if (this.scrollStart + delta > (w.page.width-w.window.width)) {
-                delta = (w.page.width-w.window.width) - this.scrollStart;
-            }
-            this.delta   = delta;
-
-            this.start(arguments[1] || {});
-        },
-
-        update: function(position) {
-            Position.prepare();
-            window.scrollTo(this.scrollStart + (position*this.delta), 0); 
-        }
-    });
-
-Effect.HScrollToElement = function(element, direction) {
-
-    element = $(element);
-
-    var viewportMiddle = Position.getPageSize().window.width/2;
-    var scrollStart = window.pageXOffset || document.documentElement.scrollLeft || document.body.scrollLeft || 0;
-    var elementMiddle = element.offsetWidth/2 + Position.cumulativeOffset(element).first();
-    var offset = scrollStart + viewportMiddle;
-    var clickOffset = Prototype.Browser.IE ? 20 : 17; //offset to keep arrows visible at 800x600
-    if (direction == 1)
-        var delta = elementMiddle - offset + clickOffset; 
-    else
-        var delta = -(offset - elementMiddle) - clickOffset;
-    new Effect.HScroll(delta);
-}
-/*
-Effect.MoveRight = Class.create();
-
-Object.extend(Object.extend(Effect.MoveRight.prototype, Effect.Base.prototype), {
-
-        initialize: function(element, delta) {
-            this.element = $(element);
-            if(!this.element) throw(Effect._elementDoesNotExistError);
-            var options = Object.extend({
-                    x:    delta
-                }, arguments[2] || {});
-            this.start(options);
-        },
-
-        setup: function() {
-            this.originalRight = this.options.initialRight || parseFloat(this.element.getStyle('right') || '0');
-        },
-
-        update: function(position) {
-            this.element.setStyle({
-                    right: Math.round(this.options.x  * position + this.originalRight) + 'px'
-                        });
-        }
-});
-*/

gucci/assets/album.css

@@ -1,302 +0,0 @@
-/* GLOBAL LAYOUT */
-
-html {
-  background: url(background.gif) repeat-x left center #95754e;
-  background-attachment: fixed;
-}
-
-body {
-  color: #2B200D;
-  margin: 0;
-  padding: 0;
-  font: 10px/14px Verdana, Arial, sans-serif;
-}
-
-* {
-  outline: none;
-  padding: 0;
-  margin: 0;
-}
-
-/* Text Selections */
-
-::-moz-selection {
-  background: transparent;
-  color: #000;
-}
-
-::selection {
-  background: transparent;
-  color: #000;
-}
-
-#logo {
-  top: -100px;
-  left: 126px;
-  position: fixed;
-  cursor: pointer;
-}
-
-#layout {
-  height: 504px;
-  margin-left: 65px;
-  margin-right: 65px;
-  position: absolute;
-}
-
-div#filling {
-  background: top right url(background-fill-2.gif);
-  height: 504px;
-  position: absolute;
-  top: 0px;
-  right: 301px;
-}
-
-/* TEXT CONTENT */
-
-ul {
-  list-style-type: none;
-  margin: 0;
-  padding: 0;
-}
-
-li {
-  color: #2B200D;
-  margin: 0;
-  padding: 0;
-}
-
-li a {
-  color: #2B200D;
-  text-decoration: none;
-}
-
-li a:hover {
-  color: #89693b;
-}
-
-div.content-block {
-  background: url(box-2-panels-background.jpg) #CCBFA5;
-  float: left;
-  height: 504px;
-  position: relative;
-}
-
-div.content-block div.info {
-  color: #2B200D;
-  float: left;
-  font-size: 10px;
-  height: 420px;
-  padding-left: 15px;
-  padding-right: 15px;
-  padding-top: 28px;
-  position: relative;
-  width: 230px;
-}
-
-div.content-block div.info p {
-  font: 10px/15px Verdana;
-  margin-top: 0px;
-  margin-bottom: 18px;
-  padding: 0;
-}
-
-div.content-block div.info a {
-  color: #2B200D;
-}
-
-div.content-block div.info a:hover {
-  color: #89693b;
-}
-
-div.content-block div.headline {
-  padding-bottom: 39px;
-}
-
-div.content-block h1 {
-  color: #89693b;
-  font: 14px/15px Verdana;
-  text-transform: lowercase;
-  margin: 0;
-  padding: 0;
-  margin-top: 6px;
-}
-
-div.content-block h2 {
-  color: #89693b;
-  font: 11px/15px Verdana;
-  text-transform: lowercase;
-  margin: 0;
-  padding: 0;
-  padding-bottom: 8px;
-}
-
-div.content-block div.title.second-column, div.content-block div.subtitle.second-column {
-  left: 275px;
-}
-
-div.content-block div.info.wide {
-  width: 360px;
-}
-
-* html div.content-block div.info.wide {
-  width: 360px;
-}
-
-div.content-block div.info.wide h1 {
-  font: 11px/15px Verdana;
-  color: #89693b;
-  padding: 0;
-  margin: 0;
-  margin-bottom: 12px;
-}
-
-div.content-block div.info.wide p, div.content-block div.info.narrow p {
-  padding: 0;
-  margin: 0;
-  margin-top: 0px;
-  margin-bottom: 18px;
-}
-
-div.content-block div.info.narrow {
-  width: 230px;
-}
-
-div.content-block img.content-block-image { 
-  float: left; 
-  position: relative;
-}
-
-/* TEXTPANELS */
-
-div.textpanel {
-  height: 504px;
-  float: left;
-  position: relative;
-  background: url(textpanel-background.gif) left top repeat-x;
-}
-
-div.textpanel {
-  width: 260px;
-}
-
-div.textpanel.wide {
-  width: 520px;
-}
-
-div.content-block div.textpanel.wide {
-  width: 520px; /* IE6 needs this to set correct width */
-}
-
-div.textpanel div.content {
-  margin-top: 140px;
-  margin-left: 28px;
-  margin-right: 28px;
-}
-
-div.textpanel.wide div.content {
-  width: 380px;
-  margin-left: 70px;
-}
-
-div.textpanel div.content h2 {
-  font-size: 20px;
-  font-weight: normal;
-  color: #6a5839;
-  margin-bottom: 40px;
-  text-shadow: 1px 1px 1px #e7e1d2;
-}
-
-div.content-block div.textpanel div.content {
-  margin-left: 55px;
-}
-
-div.content-block div.textpanel div.content h2 {
-  padding-bottom: 0px;
-}
-
-div.textpanel div.content p {
-  margin-bottom: 25px;
-  margin-top: 0;
-}
-
-
-/* PICTUREBOXES */
-
-div.picturebox {
-  float: left;
-  height: 510px;
-  position: relative;
-/*  overflow: hidden;*/
-}
-
-div.picturebox div.picture {
-  height: 504px;
-  left: 0;
-  position: absolute;
-  top: 0;
-  background: url(empty.png) repeat;
-  Z-index: 3;
-}
-
-div.shadow-bottom {
-  overflow: hidden;
-  position: absolute;
-  top: 504px; 
-  height: 6px; 
-  left: 0;
-  width: 100%;
-  background: url(shadow-bottom.gif) repeat-x;
-}
-
-div.shadow-bottom div.start {
-  background: url(shadow-bottom-start.gif);
-  height: 6px;
-  position: absolute;
-  width: 6px;
-}
-
-div.shadow-right {
-  background: url(shadow-right.gif) repeat-y;
-  height: 510px;
-  position: absolute;
-  right: -6px;
-  top: 0;
-  width: 6px;
-}
-
-div.picturebox div.darkening {
-  background: url(lightbox-lowlight-overlay.jpg);
-  position: absolute;
-  top: 0;
-  left: 0;
-  z-index: 10000; 
-}
-
-
-/* SPACERS */
-
-div#branch {
-  position: fixed;
-  left: 20px;
-  font: 14px Verdana;
-  color: #C5B89E;
-  padding: 3px;
-  background: #F2EFE8;
-  border-left: 1px solid #C5B89E;
-  border-bottom: 1px solid #C5B89E;
-  border-right: 1px solid #C5B89E;
-}
-
-* html div#branch {
-  position: absolute;
-}
-
-div.spacer-column {
-  float: left;
-  height: 504px;
-  width: 65px;
-  background: url(spacer-column.gif);
-  cursor: pointer;
-}
-

gucci/assets/album.js

@@ -1,183 +0,0 @@
-var Album = {
-
-    pictures: [],
-    queue: { position: 'end', scope: 'album' },
-
-    cubic: function(pos) {
-        pos /= 0.5;
-        return pos < 1 ? 0.5*pos*pos*pos : 0.5*((pos-2)*(pos-2)*(pos-2) + 2);
-    },
-
-    spacerEvent: function (spacer, direction) {
-      var width = (direction < 0 ? _pictures[spacer].width : _pictures[spacer + 1].width) + 65;
-         new Effect.HScroll(width * direction, { queue: Album.queue, duration: 0.5, transition: Album.cubic });
-    },
-
-    initialize: function() {
-
-        $$('div.picturebox div.picture img').each( function(img, idx) {
-                var container = img.parentNode;
-                container.addClassName('highlight');
-                container.setAttribute('id', 'pic' + idx);
-                // var darkener = $(document.createElement('div')).addClassName('darkening').setOpacity(0);
-                // container.appendChild(darkener);
-                //      Event.observe(darkener, 'click', function() {
-                //        Album.showProduct(this);
-                //      }.bind(img));
-            });
-
-
-        $$('div.spacer-column').each(function(spacer, idx) {
-
-                spacer.setAttribute('id', 'spacer' + idx);
-
-                Event.observe(spacer, 'click', function(event) {
-                        Album.spacerEvent(idx, Event.localPointer(event)[0] < 33 ? 1 : -1);
-                    });
-
-                Event.observe(spacer, 'mousemove', function(event) {
-                        var d = Event.localPointer(event)[0]<33 ? '-65' : '-130';
-                        spacer.style.backgroundPosition = d + 'px 0px';
-                    });
-
-                Event.observe(spacer, 'mouseout', function(event) {
-                        spacer.style.backgroundPosition = '0px 0px';
-                    });
-            });
-
-    },
-
-    initializeThumbsFromPictureList: function(list) {
-
-        _pictures = list;
-
-        var imgtags = $$('div.picturebox div.picture img');
-
-        var totalWidth = 0;
-        var pictureCount = 0;
-
-        imgtags.each(function(img, index) {
-                var container = img.parentNode;
-                var picturebox = container.parentNode;
-                // var darkener = img.next();
-
-                var picture = _pictures[container.id.substr(3)];
-                $(img).setStyle({ width: picture.width + 'px', height: picture.height + 'px' });
-                $(container).setStyle({ width: picture.width + 'px' });
-                $(picturebox).setStyle({ width: picture.width + 'px' });
-                $(container).onclick = function() { Album.moveIntoView(container); };
-                totalWidth += picture.width;
-                pictureCount += 1;
-            });
-
-        totalWidth += (pictureCount - 1) * 65;
-
-        $('layout').setStyle({ width: totalWidth + 'px' });
-        $('content').setStyle({ width: totalWidth + 'px' });
-        $('page-body').setStyle({ width: (totalWidth + 2 * 65) + 'px' });
-
-        Loader.reset();
-
-        setTimeout(function() {
-                this._loaderPause = false;
-                this.loadVisibleThumbs();
-            }.bind(this), 500);
-    },
-
-    loadVisibleThumbs: function() {
-
-        if (this._loaderPause) return;
-        if (this._loaderTimeout) clearTimeout(this._loaderTimeout);
-
-        this._loaderTimeout = setTimeout(function() {
-
-                var w = Position.getPageSize().window.width;
-
-                var visibles = [];
-                $$('div.picturebox div.picture img').each(function(img) {
-
-                        var container = img.parentNode;
-                        var x0 = Position.page(container)[0];
-                        var picture = _pictures[container.id.substr(3)];
-                        var x1 = x0 + picture.width;
-                        if ((x0 >= 0 && x0 < w) || (x1 >=0 && x1 < w)) {
-                            visibles.push(img);
-                        } else {
-                            Loader.remove(picture.url);
-                            img.src = 'assets/empty.gif';
-                        }
-                    });
-
-
-                visibles.each(function(img, idx) {
-
-                        var id = img.parentNode.id;
-                        var picture = _pictures[id.substr(3)];
-
-                        if (img.src == picture.url) return;
-
-                        var imageObj = picture.url;
-
-                        if (Loader.isQueued(imageObj)) return;
-
-                   // alert('Loading: ' + imageObj + '\nsrc: ' + img.src + '\nurl: ' + picture.url + '\nmatch: ' + img.src.match('assets/empty\.gif$') + '\nloader: ' + Loader.isQueued(imageObj));
-
-                        // $(img).setStyle({ position: 'relative', left: ('-' + picture.width + 'px') });
-                        Loader.cacheOrLoad(imageObj, {
-
-                                onComplete: function(obj) {
-                                    // $(img).setStyle({ position: 'relative', left: '0px'}).setOpacity(0);
-                                    img.setOpacity(0);
-                                 //   alert(obj);
-                                    img.src = obj;
-                                    new Effect.Opacity(img, { from: 0, to: 1, delay: 0.1, transition: Album.cubic, duration: 0.4 });
-                                }});
-                    });
-
-            }, 100);
-    },
-
-    moveIntoView: function(container) {
-
-        container = $(container);
-        var picture = _pictures[container.id.substr(3)];
-
-        var windowWidth   = Position.getPageSize().window.width;
-        var windowLeft    = Position.scrollX();
-        var windowRight   = windowLeft + windowWidth;
-        var pictureboxLeft  = Position.page(container)[0] - 32 + windowLeft;
-        var pictureboxRight = pictureboxLeft + picture.width;
-
-        var desiredCenter = (windowLeft + windowRight) / 2;
-        var actualCenter = (pictureboxLeft + pictureboxRight) / 2;
-        var delta = actualCenter - desiredCenter;
-
-        new Effect.HScroll(delta, { queue: Album.queue, duration: 0.5, transition: Album.cubic });
-
-/*
-        if (pictureboxRight > windowRight) {
-            if (pictureboxRight > Position.getPageSize().page.width)
-                setTimeout(function() {
-                        new Effect.HScrollTo(pictureboxRight - windowWidth, { duration: 0.5, transition: Album.cubic });
-                    }, 1000);
-            else
-                new Effect.HScrollTo(pictureboxRight - windowWidth, { queue: Album.queue, duration: 0.5, transition: Album.cubic });
-        }
-        else if (pictureboxLeft  < windowLeft)
-            new Effect.HScrollTo(pictureboxLeft, { queue: Album.queue, duration: 0.5, transition: Album.cubic });
-*/
-    },
-
-    initializeThumbsLoader: function() {
-        Event.observe(window, 'scroll', this.loadVisibleThumbs.bindAsEventListener(this));
-        Event.observe(window, 'resize', this.loadVisibleThumbs.bindAsEventListener(this));
-        Event.observe(window, 'beforeunload', this.unloadThumbs.bindAsEventListener(this));
-        this.loadVisibleThumbs();
-    },
-
-    unloadThumbs: function(){
-        $$('div.picturebox div.picture img').each(function(image) { image.src = 'assets/empty.gif' });
-    },
-
-
-};

gucci/index.html

@@ -1,86 +0,0 @@
-<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
-<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
-<head>
-<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
-<title>Album1</title>
-<link rel="shortcut icon" href="/favicon.ico" type="image/x-icon"/>
-<link rel="stylesheet" href="assets/album.css" type="text/css" media="screen"/>
-<meta http-equiv="imagetoolbar" content="false"/>
-<script src="assets/prototype.js" type="text/javascript"></script>
-<script src="assets/effects.js" type="text/javascript"></script>
-<script src="assets/album-ext.js" type="text/javascript"></script>
-<script src="assets/album.js" type="text/javascript"></script>
-</head>
-<body id="page-body">
-<div><img style="top: 583px; margin-left: -25px;" id="logo" alt="" src="assets/logo.png"/></div>
-<!-- <div id="wrapper" style="width: 3072px"> -->
-<div id="layout" style="top: 63px;">
-<div id="content" style="height: 514px">
-
-<div class="picturebox">
-    <div class="picture"><img src="assets/empty.gif" alt=""/></div>
-    <div class="shadow-bottom"><div class="start"></div></div>
-    <div class="shadow-right"></div>
-</div>
-
-<div class="spacer-column"></div>
-
-<div class="picturebox">
-    <div class="picture"><img src="assets/empty.gif" alt=""/></div>
-    <div class="shadow-bottom"><div class="start"></div></div>
-    <div class="shadow-right"></div>
-</div>
-
-<div class="spacer-column"></div>
-
-<div class="picturebox">
-    <div class="picture"><img src="assets/empty.gif" alt=""/></div>
-    <div class="shadow-bottom"><div class="start"></div></div>
-    <div class="shadow-right"></div>
-</div>
-
-<div class="spacer-column"></div>
-
-<div class="picturebox">
-    <div class="picture"><img src="assets/empty.gif" alt=""/></div>
-    <div class="shadow-bottom"><div class="start"></div></div>
-    <div class="shadow-right"></div>
-</div>
-
-<div class="spacer-column"></div>
-
-<div class="picturebox">
-    <div class="picture"><img src="assets/empty.gif" alt=""/></div>
-    <div class="shadow-bottom"><div class="start"></div></div>
-    <div class="shadow-right"></div>
-</div>
-
-<div class="spacer-column"></div>
-
-<div class="picturebox">
-    <div class="picture"><img src="assets/empty.gif" alt=""/></div>
-    <div class="shadow-bottom"><div class="start"></div></div>
-    <div class="shadow-right"></div>
-</div>
-
-</div>
-</div>
-<!-- </div> -->
-
-<script type="text/javascript"><!--
-
-  var pictures = [
-  { id: 'pic0', url: 'sample2.jpg', width: 378, height: 504 },
-  { id: 'pic1', url: 'sample1.jpg', width: 672, height: 504 },
-  { id: 'pic2', url: 'sample3.jpg', width: 741, height: 504 },
-  { id: 'pic3', url: 'sample4.jpg', width: 634, height: 504 },
-  { id: 'pic4', url: 'sample5.jpg', width: 378, height: 504 },
-  { id: 'pic5', url: 'sample6.jpg', width: 672, height: 504 } ];
-
-  Album.initialize();
-  Album.initializeThumbsFromPictureList(pictures);
-  Album.initializeThumbsLoader();
-
---></script>
-</body>
-</html>

src/org/forkalsrud/album/exif/ComparatorFactory.java

@@ -0,0 +1,126 @@
+/**
+ * 
+ */
+package org.forkalsrud.album.exif;
+
+import java.util.ArrayList;
+import java.util.Comparator;
+import java.util.Date;
+import java.util.HashMap;
+import java.util.regex.Matcher;
+import java.util.regex.Pattern;
+
+/**
+ * @author knut
+ *
+ */
+public class ComparatorFactory {
+
+	public static final String ASC = "asc";
+	public static final String DESC = "desc";
+	public static final String DIR = "dir";
+	public static final String DATE = "date";
+	public static final String NAME = "name";
+
+	static Pattern SORT_SPEC_SYNTAX = Pattern.compile("(\\w+)(\\s+(" + ASC + "|" + DESC + "))?,? *");
+
+	static ComparatorFactory singleton = new ComparatorFactory();
+
+	Comparator<Entry> directoryFirst = new Comparator<Entry>() {
+
+		public int compare(Entry e1, Entry e2) {
+
+        	if (!e1.isFile() && e2.isFile()) {
+        		return -1;
+        	} else if (e1.isFile() && !e2.isFile()) {
+        		return +1;
+        	}
+        	return 0;
+		}
+	 };
+
+
+	 Comparator<Entry> dates = new Comparator<Entry>() {
+
+		 public int compare(Entry e1, Entry e2) {
+
+			 Date d1 = e1.getDate();
+			 Date d2 = e2.getDate();
+			 if (d1 != null && d2 != null) {
+				 return d1.compareTo(d2);
+			 } else if (d1 != null) {
+				 return -1;
+			 } else if (d2 != null) {
+				 return +1;
+			 } else {
+				 return 0;
+			 }
+		 }
+	 };
+
+	 Comparator<Entry> names = new Comparator<Entry>() {
+
+		 public int compare(Entry e1, Entry e2) {
+
+			 String n1 = e1.getName();
+			 String n2 = e2.getName();
+			 if (n1 != null && n2 != null) {
+				 return n1.compareTo(n2);
+			 } else if (n1 != null) {
+				 return -1;
+			 } else if (n2 != null) {
+				 return +1;
+			 } else {
+				 return 0;
+			 }
+		 }
+	 };
+
+	 HashMap<String, Comparator<Entry>> map = new HashMap<String, Comparator<Entry>>(); 
+
+	 public ComparatorFactory() {
+
+		 map.put(DIR, directoryFirst);
+		 map.put(DATE, dates);
+		 map.put(NAME, names);
+	 }
+
+	 public static <T> Comparator<T> reverse(final Comparator<T> c) {
+
+		 return new Comparator<T>() {
+
+			public int compare(T o1, T o2) {
+				return c.compare(o2, o1);
+			}
+		 };
+	 }
+
+
+
+	 public Comparator<Entry> getComparator(String sortSpec) {
+
+		 Matcher m = SORT_SPEC_SYNTAX.matcher(sortSpec);
+		 int start = 0;
+		 ArrayList<Comparator<Entry>> list = new ArrayList<Comparator<Entry>>(); 
+		 while (m.find(start)) {
+
+			 String param = m.group(1);
+			 String direction = m.group(3);
+			 Comparator<Entry> c = map.get(param);
+			 if (c == null) {
+				 throw new IllegalArgumentException(param);
+			 }
+			 if (DESC.equals(direction)) {
+				 c = reverse(c);
+			 }
+			 list.add(c);
+			 start = m.end();
+		 }
+		 return new ComposingComparator<Entry>(list);
+	 }
+
+	 public static Comparator<Entry> getSort(String sortSpec) {
+
+		 return singleton.getComparator(sortSpec != null ? sortSpec : "dir, date");
+	 }
+}