// Copyright 2009 Daniel Arbuckle
//
// Licensed under the Apache License, Version 2.0 (the "License");
// you may not use this file except in compliance with the License.
// You may obtain a copy of the License at
//
//     http://www.apache.org/licenses/LICENSE-2.0
//
// Unless required by applicable law or agreed to in writing, software
// distributed under the License is distributed on an "AS IS" BASIS,
// WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
// See the License for the specific language governing permissions and
// limitations under the License.

SCROLL_SPEED = 1;

function init_galleries() {
    var inflated = new Element('div', {'class': 'gallery-images'});
    $$('body').grab(inflated);

    $$('.scroll-gallery').each(function(gallery) {
        var thumbnails_left = new Element('div', {'class': 'gallery-ribbon'});
        thumbnails_left.setStyle('white-space', 'nowrap');
        thumbnails_left.setStyle('display', 'inline');

        var thumbnails_middle = thumbnails_left.clone()
        var thumbnails_right = thumbnails_left.clone()

        var thumb_width = gallery.getProperty('thumb_width');
        var thumb_height = gallery.getProperty('thumb_height');
        var pop = gallery.getProperty('pop');
        var gallery_link = gallery.getProperty('href');

        if(gallery_link == null) {
            gallery_link = false;
        }

        pop = (pop == 'true');

        if(thumb_width == null) {
            thumb_width = 'auto';
        }

        if(thumb_height == null) {
            thumb_height = 'auto';
        }

        gallery.getChildren('img').each(function (image) {
            var thumb_url = image.getProperty('thumb');
            if(thumb_url == undefined) {
                thumb_url = image.getProperty('src');
            }

            var thumb = new Element('img', {'src': thumb_url, 'class': 'gallery-thumb'});
            thumb.setStyle('width', thumb_width);
            thumb.setStyle('height', thumb_height);
            thumb.setStyle('display', 'inline');

            if(gallery_link) {
                thumb.setStyle('cursor', 'pointer');
                thumb.addEvent('click', function() {
                    location.href = gallery_link;
                });
            }

            if(pop) {
                var full = new Element('div', {'class': 'gallery-frame'});
                full.setStyle('display', 'none');
                var caption = new Element('span', {'class': 'caption'});
                caption.appendText(image.getProperty('caption'));
                image.setStyle('max-width', full.getStyle('max-width'));
                image.setStyle('max-height', full.getStyle('max-height').toInt() - caption.getStyle('line-height').toInt());
                image.setStyle('display', 'block');
                full.store('depth', 0);
                full.grab(image);
                full.grab(caption);
                inflated.grab(full);

                function enter() {
                    full.store('depth', full.retrieve('depth') + 1);
                    full.setStyle('position', 'fixed');
                    full.setStyle('top', '30px');
                    full.setStyle('display', 'block');
                    console.log(window.getSize(), image.getSize());
                    full.setStyle('left', (window.getSize().x - image.getSize().x) / 2);
                }

                function exit() {
                    var depth = full.retrieve('depth') - 1;
                    if(depth <= 0) {
                        depth = 0;
                        full.setStyle('display', 'none');
                    }
                    full.store('depth', depth);
                }

                thumb.addEvent('mouseenter', enter);
                full.addEvent('mouseenter', enter);
                thumb.addEvent('mouseleave', exit);
                full.addEvent('mouseleave', exit);
            }
            else {
                image.setStyle('display', 'none');
            }

            thumbnails_left.grab(thumb);
            thumbnails_middle.grab(thumb.clone().cloneEvents(thumb));
            thumbnails_right.grab(thumb.clone().cloneEvents(thumb));
        });

        var scroll_left = new Element('div', {'class': 'gallery-scroll-left'});
        var viewport = new Element('div', {'class': 'gallery-viewport'});
        var scroll_right = new Element('div', {'class': 'gallery-scroll-right'});

        scroll_left.grab(new Element('img', {'src': '/static/image/arr_teal_clear_left.gif', 'vertical-align': 'center'}));
        scroll_right.grab(new Element('img', {'src': '/static/image/arr_teal_clear_right.gif', 'vertical-align': 'center'}));
        viewport.setStyle('overflow', 'hidden');
        viewport.setStyle('white-space', 'nowrap');


        viewport.store('left', thumbnails_left);
        viewport.grab(thumbnails_left);

        viewport.store('base', thumbnails_middle);
        viewport.grab(thumbnails_middle);

        viewport.store('right', thumbnails_right);
        viewport.grab(thumbnails_right);


        gallery.grab(scroll_left);
        gallery.grab(viewport);
        gallery.grab(scroll_right);

        function scroll(direction) {
            var position = viewport.getScroll().x + direction;

            if(direction < 0) {
                if(position <= viewport.retrieve('left').getPosition(viewport).x) {
                    viewport.scrollTo(viewport.retrieve('base').getPosition(viewport).x, 0);
                }
                else {
                    viewport.scrollTo(position, 0);
                }
            }
            else if(direction > 0) {
                if(position >= viewport.retrieve('right').getPosition(viewport).x) {
                    viewport.scrollTo(viewport.retrieve('base').getPosition(viewport).x, 0);
                }
                else {
                    viewport.scrollTo(position, 0);
                }
            }

            return true;
        }

        scroll_left.addEvent('mouseenter', function() {
            scroll_left.store('scroll timer', scroll.periodical(10, viewport, -SCROLL_SPEED));
        });

        scroll_left.addEvent('mouseleave', function() {
            $clear(scroll_left.retrieve('scroll timer'));
        });

        scroll_right.addEvent('mouseenter', function() {
            scroll_right.store('scroll timer', scroll.periodical(10, viewport, SCROLL_SPEED));
        });

        scroll_right.addEvent('mouseleave', function() {
            $clear(scroll_right.retrieve('scroll timer'));
        });

        viewport.scrollTo(viewport.retrieve('base').getPosition(viewport).x, 0);
    });
}

window.addEvent('domready', init_galleries);
