// TODO: docs
// see sites/esteelauder/us/js/v2/internal/pwp.js for examples of how to use
Popover = Class.create({
    initialize: function(args) {
        var args = args || {};
        this.key = args.key || "";
        this.onAccept = args.onAccept || null;
        this.onShow = args.onShow || null;
        this.onRefuse = args.onRefuse || null;
        this.onClose  = args.onClose  || null;
        // fire refuse events when closing popup. default is yes
        this.refuseOnClose = (typeof args.refuseOnClose === "boolean") ? args.refuseOnClose : true;
        
        // fire the close events when refusing. Default is true b/c 
        // the situations in which this popover class is commonly used, 
        // closing the popup is supposed to be the same as refusing the 
        // choice
        this.closeOnRefuse = (typeof args.closeOnRefuse === "boolean") ? args.closeOnRefuse : true;
        // clicking the nodes with this class will fire
        // the onAccept/onRefuse events
        // closing popover fires onRefuse event
        this.acceptClass = (args.acceptClass) ? '.' + args.acceptClass : ".accept_node";
        this.refuseClass = (args.refuseClass) ? '.' + args.refuseClass : ".refuse_node";
        this.closeClass  = (args.closeClass)  ? '.' + args.closeClass  : ".close_node";
        // this is used to make sure the controls in
        // the default popup are hidden. default is true as
        // most popups to this point have had 'close' links
        // within the image resources provided
        this.hideControls = args.hideControls || true;
        
        this.templateArgs = args.templateArgs || {};
        
        // allow for custom popup styles
        this.cssStyle = args.cssStyle || null;
    },
    
    show: function() {
        var self = this;
        var processor = "/includes/popup_processor.tmpl";

        if (!this.key) {
            // TODO: throw an error here
            return;
        }
        
        processor += "?key=" + this.key;
        
        generic.templatefactory.get({path: processor}).evaluateCallback({
            object: this.templateArgs,
            callback: function(html) {
                var temp = new Element("div");
                temp.id = "popup-container";
                temp.innerHTML = html;
                
                var close_btns, refuse_node, accept_node;
                
                var showCloseLink = function() {
                    $$(".close-container").each(function(c) {
                        c.setStyle({ display: "block" });
                    });
                };
                
                var hideCloseLinks = function() {
                    $$(".close-container").each(function(c) {
                        c.setStyle({ display: "none" });
                    });
                };
                
                refuse_node = temp.select(self.refuseClass)[0];
                accept_node = temp.select(self.acceptClass)[0];
                
                if (refuse_node) {
                    $(refuse_node).observe("click", function(e) {
                        console.log("refusing");
                        if (self.closeOnRefuse) {
                            self.hide();
                            showCloseLink();
                        }
                        self.onRefuse && self.onRefuse();
                    });
                }
                
                if (accept_node) {
                    $(accept_node).observe("click", function(e) {
                        console.log("accepting");
                        self.onAccept && self.onAccept();
                    });
                }
                
                // all popovers should have close links
                // support multiple close nodes for a 
                // single popup
                close_btns = temp.select(self.closeClass);
                if (close_btns) {
                    close_btns.each(function(close_btn) {
                        $(close_btn).observe("click", function(e) {
                            self.onClose && self.onClose();
                            console.log("closing");
                            self.hide();
                            showCloseLink();
                            if (self.refuseOnClose) {
                                self.onRefuse && self.onRefuse();
                            }
                        });
                    });
                }
                
                // positioning needs to come from config
                var width = 540;
                var windowWidth = (generic.env.isIE) ? document.documentElement.clientWidth : window.innerWidth;
                var scrolledY = (generic.env.isSafari) ? document.body.scrollTop : document.documentElement.scrollTop;
                var heightFromTop = 170;
                
                var x = ((windowWidth / 2) - (width/2));
                var y = scrolledY + heightFromTop;
                
                var cssStyle;
                if (self.cssStyle) {
                    cssStyle = self.cssStyle;
                } else {
                    cssStyle = {
                        left: x + "px",
                        top: y + "px",
                        border: "none",
                        padding: 0,
                        backgroundColor: "transparent"
                    };
                }
                
                generic.overlay.launch({
                    content: temp,
                    includeBackground: true,
                    lockPosition: true,
                    center: false,
                    cssStyle: cssStyle
                });
                
                self.onShow && self.onShow();
                hideCloseLinks();
            }
        });
    },
    
    hide: function() {
        generic.overlay.hide();
    },
    
    showProgress: function() {
        // this relies on a node having the class 'progressNode' 
        // in the popup. 
        var container = $("popup-container"); // comes from 'show'
        // container with this class is getting hidden
        var popup = container.select(".popup")[0];
        var progressNode = container.select(".progressNode")[0];
        if (!progressNode || !popup) { 
            return;
        }
        
        popup.hide();
        progressNode.show();
        progressNode.setStyle({ "display" : "block" });
    }
});