document.write('<script src="/javascripts/scriptaculous/effects.js" type="text/javascript"></script>');
function lnl_home()
{
    //setup the rotating banner adverts
    if ($('banners'))
    {
        var banners = $('ad-banners').childElements();
    }
    else
    {
        var banners = new Array();
    }
    var num_banners = banners.length;
    var current_banner = 0;
    var previous_banner = 0;

    function rotate_banners()
    {
        if (num_banners > 1)
        {
            Effect.Fade(banners[current_banner],{ queue: 'front', duration: 0.4});
            current_banner = current_banner + 1;
            if (current_banner >= num_banners)
            {
                current_banner = 0;
            }
            Effect.Appear(banners[current_banner],{ queue: 'end', duration: 0.6});
        }
    }
    // Revert to 6 after Flash LNL Christmas book banner has been removed
    new PeriodicalExecuter(rotate_banners, 18);

    //Setup the show hide for the what's on panel
    Event.observe('view_midweek','click', function(event) {
        Element.show($('midweek-body'));
        Element.hide($('weekend-body'));
        Event.stop(event);
    })

    Event.observe('view_weekend','click', function(event) {
        Element.show($('weekend-body'));
        Element.hide($('midweek-body'));
        Event.stop(event);
    })

    if (GBrowserIsCompatible() && $('venue_map'))
    {
        var venue_markers = [];
        var overlay_displayed = true;

        var city_point = new GLatLng(51.51623510922950, -0.09098052978515625);
        var westend_point = new GLatLng(51.51261528840246, -0.12917518615722656);
        //var default_point = new GLatLng(51.512695412435164, -0.11072158813476562);
        var default_point = new GLatLng(51.51654120027656, -0.10557174682617188);
        //var outer_london_point = new GLatLng(51.37199469960235, -0.09990692138671875);

        var map = new GMap2($('venue_map'));
        map.setCenter(default_point, 13);
        map.addControl(new GSmallMapControl());

        // A TextualZoomControl is a GControl that displays textual "Zoom In"
        // and "Zoom Out" buttons (as opposed to the iconic buttons used in
        // Google Maps).
        function FakeControl() {
        }
        FakeControl.prototype = new GControl();

        // Creates a one DIV for each of the buttons and places them in a container
        // DIV which is returned as our control element. We add the control to
        // to the map container and return the element for the map class to
        // position properly.
        FakeControl.prototype.initialize = function(map) {
            var container = Element.extend(document.createElement("div"));
            container.setStyle({
                height: '1px',
                width: '728px'
            });

            map.getContainer().appendChild(container);
            return container;
        }

        FakeControl.prototype.getDefaultPosition = function() {
            return new GControlPosition(G_ANCHOR_TOP_LEFT, new GSize(1, 1));
        }

        map.addControl(new FakeControl());

        var icon = new GIcon();
        icon.image = "http://labs.google.com/ridefinder/images/mm_20_purple.png";
        icon.shadow = "http://labs.google.com/ridefinder/images/mm_20_shadow.png";
        icon.iconSize = new GSize(12, 20);
        icon.shadowSize = new GSize(22, 20);
        icon.iconAnchor = new GPoint(6, 20);
        icon.infoWindowAnchor = new GPoint(5, 20);

        places.each(function(place, place_name)
        {
            var point = new GLatLng(place.lat, place.lon);

            var marker = new GMarker(point,{icon: icon});

            marker.tooltip = '<div class="map_tooltip">'+ place.name +'</div>';
            marker.has_bar = place.has_bar;
            marker.has_restaurant = place.has_restaurant;
            marker.has_dance_floor = place.has_dance_floor;

            GEvent.addListener(marker,"mouseover", function() {
                map_tooltip.innerHTML = marker.tooltip;
                var point = map.getCurrentMapType().getProjection().fromLatLngToPixel(map.getBounds().getSouthWest(),map.getZoom());
                var offset = map.getCurrentMapType().getProjection().fromLatLngToPixel(marker.getPoint(),map.getZoom());
                var anchor = marker.getIcon().iconAnchor;
                var width = marker.getIcon().iconSize.width;
                var pos = new GControlPosition(G_ANCHOR_BOTTOM_LEFT, new GSize(offset.x - point.x - anchor.x + width,- offset.y + point.y +anchor.y));
                pos.apply(map_tooltip);
                map_tooltip.style.visibility="visible";
            });

            GEvent.addListener(marker,"mouseout", function() {
                map_tooltip.style.visibility="hidden"
            });

            GEvent.addListener(marker, "click", function() {
                marker.openInfoWindowTabsHtml(infoTabs);
            });

            var infoTabs = new Array();
            infoTabs.push(new GInfoWindowTab("Details", place.details));
            infoTabs.push(new GInfoWindowTab("Events", place.events));
            infoTabs.push(new GInfoWindowTab("Hotels", hotel_html));

            if (place.gallery != false)
            {
                infoTabs.push(new GInfoWindowTab("Gallery", place.gallery));
            }
            map.addOverlay(marker);
            venue_markers.push(marker);
        }.bind(this));

        var map_tooltip = document.createElement("div");
        document.getElementById("venue_map").appendChild(map_tooltip);
        map_tooltip.style.visibility="hidden";

        function BarsOnly()
        {
            venue_markers.each(function(marker)
            {
                if (marker.has_bar == true)
                {
                    marker.show();
                }
                else
                {
                    marker.hide();
                }
            }.bind(this));
        }

        function RestaurantsOnly()
        {
            venue_markers.each(function(marker)
            {
                if (marker.has_restaurant == true)
                {
                    marker.show();
                }
                else
                {
                    marker.hide();
                }

            }.bind(this));
        }

        function DanceFloorOnly()
        {
            venue_markers.each(function(marker)
            {
                if (marker.has_dance_floor == true)
                {
                    marker.show();
                }
                else
                {
                    marker.hide();
                }

            }.bind(this));
        }

        function overlay_disappear()
        {
            if (overlay_displayed == true)
            {
                Effect.Squish('map-overlay',{duration: 0.5});
                overlay_displayed = false;
            }
        }

        var mapControls = document.getElementsByClassName('map-control', 'venue-map-controls')
        function highlight(item)
        {
            // Reset the others
            mapControls.each(function(control) {
                if (item.hasClassName('type') && control.hasClassName('type'))
                {
                    control.setStyle({
                        color: '#fff',
                        background: 'none'
                    })
                }
                else if (item.hasClassName('location') && control.hasClassName('location'))
                {
                    control.setStyle({
                        color: '#fff',
                        background: 'none'
                    })
                }
            })
            item.setStyle({
                color: 'white',
                backgroundColor: '#1188c0',
                backgroundImage: 'url(../img/ps/map-control-arrow2.gif)',
                backgroundPosition: 'top center',
                backgroundRepeat: 'no-repeat'
            })
        }

        var centerspot = null;

        GEvent.addListener(map, "infowindowopen", function() {
            centerspot = map.getCenter();
        });
        GEvent.addListener(map, "infowindowclose", function() {
            if (centerspot != null)
            {
                map.panTo(centerspot);
            }});
            GEvent.addListener(map, "dragend", function() {
                centerspot = null;
            });

            $('display_only_bars').href = '#';
            Event.observe('display_only_bars', 'click', function(event) {
                overlay_disappear();
                highlight(Event.element(event))
                BarsOnly();
                Event.stop(event);
            })

            $('display_only_restaurants').href = '#';
            Event.observe('display_only_restaurants', 'click', function(event) {
                overlay_disappear();
                highlight(Event.element(event))
                RestaurantsOnly();
                Event.stop(event);
            })

            $('display_only_dance_floors').href = '#';
            Event.observe('display_only_dance_floors', 'click', function(event) {
                overlay_disappear();
                highlight(Event.element(event))
                DanceFloorOnly();
                Event.stop(event);
            })

            $('city_centre').href = '#';
            Event.observe('city_centre', 'click', function(event) {
                overlay_disappear();
                highlight(Event.element(event))
                map.setZoom(14);
                map.panTo(city_point);
                Event.stop(event);
            })

            $('westend_centre').href = '#';
            Event.observe('westend_centre', 'click', function(event) {
                overlay_disappear();
                highlight(Event.element(event))
                map.setZoom(14);
                map.panTo(westend_point);
                Event.stop(event);
            })

//            $('greater_london').href = '#';
  //          Event.observe('greater_london', 'click', function(event) {
    //            overlay_disappear();
      //          highlight(Event.element(event))
        //        BarsOnly();
          //      //map.setZoom(9);
            //    //map.panTo(default_point);
              //  map.setZoom(14);
                //map.panTo(outer_london_point);
                //Event.stop(event);
            //})

            Event.observe('revealmap_link','click', function(event) {
                overlay_disappear();
                Event.stop(event);
            })

            //make the overlay disappear after a set time
            new PeriodicalExecuter(function (pe) {
                overlay_disappear();
                pe.stop();
            }, 120);


            Event.observe(window, 'unload', function() {
                // Stop Google maps memory leaks
                GUnload()
            })

            //make the map controls visible
            $('venue-map-controls').style.visibility='visible';
    }
}

var ScrollingPanesLoaded = false
var ScrollingPanes = Class.create();
ScrollingPanes.prototype = {
    initialize: function(scrollerClassName) {
		if (ScrollingPanesLoaded) return
		ScrollingPanesLoaded = true
        this.scrollerClassName = scrollerClassName = 'scroller'
        this.animating = false

        this.scrollers = this.getScrollers()
        this.scrollers.each(function(scroller) {
            this.initializePanes(scroller);
            this.numPanes = scroller.panes.length;
            if (scroller.panes.length > 4)
            {
                this.activateControls(scroller);
                this.leftPane = 0;
                this.rightPane = 3;
            }
        }.bind(this))
    },

    getScrollers: function()
    {
        return document.getElementsByClassName(this.scrollerClassName).collect(function(container) {
            return this.getPanes(container)
        }.bind(this))
    },

    getPanes: function(container)
    {
        return {
            container: container,
            panes: container.childElements(),
            controls: {
                left: container.previous('a.left'),
                right: container.next('a.right')
            }
        }
    },
    initializePanes: function(scroller)
    {
        scroller.container.setStyle({
            position: 'relative',
            overflow: 'hidden',
            padding: 0,
            listStyle: 'none'
        })

        scroller.panes.each(function(pane, index) {
            pane.setStyle({
                position: 'absolute',
                top: 0,
                left: index*25+'%'
            });
            pane.position = index;
        })

        return scroller
    },

    activateControls: function(scroller)
    {
        scroller.controls.left.observe('click', this.moveLeft.bindAsEventListener(this, scroller))
        scroller.controls.left.show();
        scroller.controls.right.observe('click', this.moveRight.bindAsEventListener(this, scroller))
        scroller.controls.right.show();
    },

    moveLeft: function(event, scroller)
    {
        if (this.animating == false)
        {
            this.nextPane = this.leftPane -1;
            if (this.nextPane < 0)
            {
                this.nextPane = this.numPanes -1;
            }
            
scroller.panes[this.nextPane].setStyle({
                position: 'absolute',
                top: 0,
                left: '-25%'
            });

            this.movePanes(scroller.panes, 'left', 1, 5);
            this.leftPane = this.nextPane;
            this.rightPane = this.rightPane - 1;
            if (this.rightPane < 0)
            {
                this.rightPane = this.numPanes - 1;
            }
        }
        Event.stop(event)
    },

    moveRight: function(event, scroller)
    {
        if (this.animating == false)
        {
            this.nextPane = this.rightPane + 1;
            if (this.nextPane >= this.numPanes)
            {
                this.nextPane = 0;
            }
            
scroller.panes[this.nextPane].setStyle({
                position: 'absolute',
                top: 0,
                left: '100%'
            });

            this.movePanes(scroller.panes, 'right', 1, 5);
            this.rightPane = this.nextPane;
            this.leftPane = this.leftPane + 1;
            if (this.leftPane >= this.numPanes)
            {
                this.leftPane = 0;
            }
        }

        Event.stop(event)
    },
    movePanes: function(panes, direction, amount)
    {
        this.animating = true
        this.frame = 1;

        new PeriodicalExecuter(function(exectuer) {
            if (this.frame < 7)
            {
                speed = 3;
            }
            else if (this.frame < 10)
            {
                speed = 2;
            }
            else
            {
                speed = 1;
                this.animating = false;
                exectuer.stop();
            }
            this.frame = this.frame + 1;

            panes.each(function(pane) {
                var currentPosition = parseInt(pane.getStyle('left').replace('%', ''))
                var newPosition = currentPosition

                if (direction == 'left')
                {
                    newPosition += speed
                }
                else if (direction == 'right')
                {
                    newPosition -= speed
                }

                pane.setStyle({left: newPosition+'%'})


            }.bind(this))
        }.bind(this), .005)

        return panes
    },

    atBeginning: function(panes)
    {
        if (panes[0].getStyle('left') == '0%')
        {
            return true
        }
        else
        {
            return false
        }
    },

    atEnd: function(panes)
    {
        if (panes[panes.length-4].getStyle('left') <= '0%')
        {
            return true
        }
        else
        {
            return false
        }
    }
}


Event.observe(window, 'load', function() {
        lnl_home();
        new ScrollingPanes();
})