YAHOO.namespace('com.angelaseye');

YAHOO.com.angelaseye = function() {
    var $D = YAHOO.util.Dom;
    var $E = YAHOO.util.Event;
    var $ = $D.get;
    
    // Define global frontpage objects
    var StoryArray = [];
    var _cur;
    var _main;
    var storyElements;
    
    var FrontPageInit = function() {
        var focusStory = function(e, num) {
            // pass the number to aviod bubbling issues
            var newel = StoryArray[num];

            var fiattr = { opacity : { to:1 }};
            var foattr = { opacity : { to:0 }};

            var removeElement = function(){
                var el = this.getEl();
                //make sure we always have one element
                if(el!=_cur){
                    el.parentNode.removeChild(el);
                };
            }
            
            if(newel!=_cur){
                _main.appendChild(newel);
                var fadein = new YAHOO.util.Anim(newel, fiattr);
                var fadeout = new YAHOO.util.Anim(_cur, foattr);
                fadein.animate();
                fadeout.onComplete.subscribe(removeElement);
                fadeout.animate();
                for(var i=0;i<storyElements.length;i++){
                    $D.removeClass(storyElements[i], 'selected');
                }
                $D.addClass(storyElements[num], 'selected');
                _cur = newel;
            }
        };
        
        var arrow = {
            init : function() {
                var arrow = document.createElement('img');
            }   
        };

        //gather the important DOM elements
        _main = $('mainstory');
        _cur = $('storyholder');

        //define the initial _cur so you don't get an accidental fade
        var newel = StoryArray[0];
        $D.addClass(storyElements[0], 'selected');
        _main.appendChild(newel);
        $D.setStyle(newel, 'opacity', 1);
        _main.removeChild(_cur);
        _cur = newel;

        // Loop over story elements, add rollover
        for(var i = 0; i < storyElements.length; i++){
            $E.on(storyElements[i], 'mouseover', focusStory, i);
            var h1el = $D.getLastChild(storyElements[i]);
            //$D.setStyle(h1el, 'opacity', .7);
        }
        
        var carousel = function() {
            var carousel = $('topstorylist');
            var pos = $D.getXY(carousel);
            var region = $D.getRegion(carousel);
            var new_pos = 0;
            var len = $D.getChildren(carousel).length;
            var item_height = (region.bottom - region.top)/len;
            var moveStories = function (e, num) {
                $E.stopEvent(e);
                if(-1 < (new_pos + num) && (new_pos + num) < len-2) {
                    new_pos = new_pos + num;
                    var new_point = -new_pos * item_height + pos[1];
                    var anim = new YAHOO.util.Motion(carousel, {
                        points : { to: [pos[0], new_point] }
                    }, 0.2);
                    anim.animate();
                }
            };
            $E.on('storydown', 'click', moveStories, 1);
            $E.on('storyup', 'click', moveStories, -1);
        }();
        
        //var ad = $('leaderboard');
        //var ord=Math.floor(Math.random()*1000);
        //document.write('<script type="text/javaScript" src="http://ad.doubleclick.net/adj/ibs.det.entertainment/;kw=mallonmail;sz=728x90;ord=' + ord + '?"><\/script>')
    };
    
    var PaparazziItem = function(el) {
        var ele = el;
        var pos = $D.getXY(ele);
        var region = $D.getRegion(ele);
        var new_pos = 0;
        var len = $D.getChildren(ele).length;
        var item_width = (region.right - region.left)/len;
        console.log(region.right)
        console.log(region.left)
        var movePop = function (e, num) {
            $E.stopEvent(e);
            if(-1 < (new_pos + num) && (new_pos + num) < len-2) {
                new_pos = new_pos + num;
                var new_point = -new_pos * item_width + pos[0];
                var anim = new YAHOO.util.Motion(ele, {
                    points : { to: [new_point, pos[1]] }
                }, 0.2);
                anim.animate();
            }
        };
        $E.on('popleft', 'click', movePop, 1);
        $E.on('popright', 'click', movePop, -1);
        
    };
    
    var createMain = function(headline, image, summary, url){
        var _newMain = document.createElement('div');

        var mainimgholder = document.createElement('a');
        mainimgholder.href = url;
        var img = document.createElement('img');
        img.src = image;
        $D.addClass(mainimgholder,'mainimgholder');
        $D.addClass(img, 'center');
        mainimgholder.appendChild(img);
        _newMain.appendChild(mainimgholder);

        var title = document.createElement('h1');
        var titlelink = document.createElement('a');
        titlelink.href = url;
        titlelink.innerHTML = headline;
        title.appendChild(titlelink);
        _newMain.appendChild(title);

        var sum = document.createElement('p');
        sum.innerHTML = summary + "<br /><a href='" + url + "'>Full Story</a>";
        _newMain.appendChild(sum);
        $D.setStyle(_newMain, 'position', 'absolute');
        $D.setStyle(_newMain, 'opacity', 0);
        return _newMain
    }

    //slideshow global objects
    var lightbox;
    var currentImg = 0;
    
    var makeSlideshow = function(slideshow, imgs) {
        imgholder = $('slideshowimg');
        desc = $('description');
        var countImgs  = function() {
            i=0;
            for(var item in imgs) {
                i++;
            }
            return i
        }
        var changeimg = function(e, num) {
            $E.stopEvent(e);
            currentImg += num;
            currentImg %= countImgs();
            while(currentImg < 0) {
                currentImg += countImgs();
            }
            imgholder.src = imgs['image'+currentImg].thurl;
            desc.innerHTML = imgs['image'+currentImg].text;
        }
        var startlightbox = function(e) {
            $E.stopEvent(e);
            lightbox.show(['image'+currentImg]);
        }   
        $E.on('getprevimage', 'click', changeimg, -1);
        $E.on('getnextimage', 'click', changeimg, 1);
        $E.on(imgholder, 'click', startlightbox);
    };

    var ssimgs;

    return {
        init : function() {
            //First look for the homepage story elements
            storyElements = $D.getElementsByClassName('topstory', 'li', 'topstories');
            if(storyElements.length){
                FrontPageInit();
            }
            
            // then create the slideshow
            var slideshow = $('slideshow');
            if(slideshow){
                makeSlideshow(slideshow, ssimgs);
            }
            // var paparazzi = $('paparazzi_mover');
            // if(paparazzi) {
            //     PaparazziItem(paparazzi);
            // }
        },
        
        makeSlideshow : function(slideshowimgs) {
            ssimgs = slideshowimgs;
            lightbox = new YAHOO.com.thecodecentral.Lightbox(slideshowimgs);
        },
        
        addStory : function(headline, image, summary, url) {
            StoryArray.push(createMain(headline, image, summary, url));
        },
        
        showLightBox : function(event, image) {
            $E.stopEvent(event);
            lightbox.show(image);
        }
    }
}();
YAHOO.util.Event.on(window, 'load', YAHOO.com.angelaseye.init, YAHOO.com.angelaseye, true);