﻿/*Quicklook Functions*/

var ActiveQuickLook;
function openQuicklook(id, type, show_only_sale_variations, show_only_shippable_sizes, e) {    
    ActiveQuickLook = new quicklook(id, type, show_only_sale_variations, show_only_shippable_sizes,e);
    ActiveQuickLook.show()
    
   return stopBubbling(e); //stop the parent container from firing event which redirects to detail page
}

function closeQuicklook(e) {
   
    if( ActiveQuickLook )
    ActiveQuickLook.hide()     
   
    return stopBubbling(e); //stop the parent container from firing event which redirects to detail page 
}

function stopBubbling(e) {

  if(!e)
    e = window.event;
  
  if(e.stopPropagation)
    e.stopPropagation();
  
  if(e.preventDefault)
    e.preventDefault();
    
  e.cancelBubble = true;
  e.cancel = true;
  e.returnValue = false;
  return false;
     
} 


/*** 
  * Quicklook Structure and Functionality
***/

quicklook = function(id, type, show_only_sale_variations, show_only_shippable_sizes,e) {
      this._id = id;
      this._type = type;
      this._show_only_sale_variations = show_only_sale_variations;
      this._show_only_shippable_sizes = show_only_shippable_sizes;
      this._onCloseHandler = null;
      this._addToCartHandler = null;
      this._tabChangedHandler = null;
      this. _onMoreImagesHandler = null;
      this._onBodyClickHandler = null;
      this._web_path = "";
      
      this._parent_element = (e.srcElement) ? e.srcElement : e.target;
}

quicklook.prototype = {

    init: function() {
   
        var elem = $get('quicklook');
        if( !elem ) 
        {
                elem = document.createElement('div');
                elem.id = 'quicklook';
                document.forms[0].appendChild(elem);
        }
        
    },
    
   dispose: function() {
   
        var _quicklook_container =  $get('quicklook');
         this._id = 0;
         this._type = '';
         this._show_only_sale_variations = false;
         this._show_only_shippable_sizes = false;
         this._onCloseHandler = null;
         this._addToCartHandler = null;
         this._tabChangedHandler = null;
         this. _onMoreImagesHandler = null;
         this._onBodyClickHandler = null;
         this._web_path = "";
        
        while (_quicklook_container.hasChildNodes())
	    {
	      _quicklook_container.removeChild(_quicklook_container.firstChild);
	    }
    
   },     
   
   show: function() {
          
       this.init();
       
       var _quicklook_container =  $get('quicklook');
        _quicklook_container.innerHTML = ActiveQuickLook._get_loading_html() 
   
       try
       { 
           this._get_data()       
       }
       catch (error)
       {

       }         

       
   }, 

    hide: function() {
   
         var _quicklook_container = ActiveQuickLook._get_container();
        _quicklook_container.style.display = "none"
        
        ActiveQuickLook.dispose();
    
   }, 
   
  
   /***********
   * Properties
   *
   ************/
    get_id: function() {
        return this._id;
    },
   
    get_type: function() {
        return this._type;
    },
   
    get_show_only_sale_variations: function() {
        return this._show_only_sale_variations;
    },  
   
   get_show_only_shippable_sizes: function() {
        return this._show_only_shippable_sizes;
    },   
   
   _get_container: function() {
        return $get('quicklook');
   }, 
   
    get_web_path: function() {
        return this._web_path;
    },   
    set_web_path: function(value) {
        this._web_path = value;
    },
   
    get_parent_element: function() {
        return this._parent_element;
    },   
    set_parent_element: function(value) {
        this._parent_element = value;
    }, 
   
    get_selected_size: function() {
        var ddl_sizes = $get('quicklook_ddl_size_price') 
        return ddl_sizes.options[ddl_sizes.selectedIndex];
    },   
   
    get_inputed_quantity: function() {
        return $get('quicklook_tbx_quantity').value;
    },   
   
   set_details_additional: function(value) {
        $get('quicklook_details_additional_info').innerHTML = value;
    }, 
   
    set_details_message: function(value) {
            var elem = $get('quicklook_details_message')
            elem.innerHTML = value;
    },  
   
   
   _position: function() {
   
          /******************/
        /*Position Element*/
        var _quicklook_container =  $get('quicklook');
        _quicklook_container.style.display = "block";

        _parent = ActiveQuickLook.get_parent_element();
        var parent_bounds = Sys.UI.DomElement.getBounds(_parent);
        var quicklook_bounds = Sys.UI.DomElement.getBounds(_quicklook_container)
        var _screen_width = 0;
        var _screen_height = 0;
        
        var ScrollTop = document.body.scrollTop;

        if (ScrollTop == 0)
        {
            if (window.pageYOffset)
                ScrollTop = window.pageYOffset;
            else
                ScrollTop = (document.body.parentElement) ? document.body.parentElement.scrollTop : 0;
        }

        if( Sys.Browser.agent == Sys.Browser.InternetExplorer )
        {
            _screen_width = document.documentElement.clientWidth;
            _screen_height = document.documentElement.clientHeight;
        }
        else 
        {
            _screen_width = window.innerWidth;
            _screen_height = window.innerHeight ;
        }
        

        var _parent_width = _parent.width;
        var _left, _top;
        _left = (parent_bounds.x + parent_bounds.width)-  quicklook_bounds.width ;
        _top = parent_bounds.y - quicklook_bounds.height;


        //Check Right side of quick look
        if( _screen_width < (quicklook_bounds.x + quicklook_bounds.width ) )
        {
            _left =  (quicklook_bounds.x + quicklook_bounds.width) - _screen_width;
            _left =  quicklook_bounds.x - _left;            
        }
        
        //Check Left side of quick look
        if( _left < 0 )
        {
            _left = 0
        }
        
        //Check Top side of quick look
        if( _top < 0 )
        {
            _top = 0
        }
        
        if( _top < ScrollTop )
        {
            _top = ScrollTop;
        }
               

        
//        _quicklook_container.innerHTML = 'Screen Width (' +_screen_width + ')<br />' 
//        + 'Parent Bounds {id: ' + _parent.id + ', x: ' + parent_bounds.x +', y: ' + parent_bounds.y + ', width: ' + parent_bounds.width +  ', height: ' +  parent_bounds.height + '}<br />'
//        + 'Quicklook Bounds {x: ' + quicklook_bounds.x  +', y: ' + quicklook_bounds.y  + ', width: ' + quicklook_bounds.width +  ', height: ' + quicklook_bounds.height + '}<br />'
//        + 'Result {left: ' + _left + ', top: ' + _top + '}'
        
        //alert(_left + ' - ' + _top)
        Sys.UI.DomElement.setLocation(_quicklook_container, _left, _top);
   }, 
   
    default_button: function(btnID, event) { 

     var btn = $get(btnID); 
     if (document.all)
     { 
       if (event.keyCode == 13)
       { 
             event.returnValue=false;
             event.cancel = true;
             btn.click();
             stopBubbling(event) 
        } 
     } 
     else if (document.getElementById)  
     { 
       if (event.which == 13)
       { 
            event.returnValue=false;
            event.cancel = true;
            btn.click();
            stopBubbling(event)  
        }
     } 
     else if (document.layers) 
     {
       if (event.which == 13)
       {
           event.returnValue=false;
           event.cancel = true;
           btn.click();
           stopBubbling(event) 
       }
     } 
},
  
   /***********
   * Product Retrieval Functions
   *
   ************/
    _get_data: function() {
        asplants.products_ac.get_quicklook_product(this.get_id(), this.get_type(), this.get_show_only_sale_variations(), this.get_show_only_shippable_sizes(), this._get_data_ONSUCCESS,this._get_data_ONERROR, "GETPRODUCT");        
   },
   
   _get_data_ONSUCCESS: function(result, eventArgs) {

        //Build Resulting View
        var _quicklook_container = ActiveQuickLook._get_container();
       
       var _html = ActiveQuickLook._get_quicklook_template();
     _quicklook_container.innerHTML = _html
     
     
     /*************************************************/
     /*Build Quicklook based on data retrieved*/
     var _name = $get('quicklook_name');
     _name.innerHTML = result.name;
     
     if( result.subname != '' )
     {
           var _subname = $get('quicklook_subname');
           _subname.innerHTML = result.subname;
     }
     
     if( result.thumbnail != '' ) 
     {
        var _thumbnail = $get('quicklook_img');
        _thumbnail.src = result.thumbnail;
     }
     
     var _more_images = $get('quicklook_more_images');
     if( result.has_additional_images )
     {
        
     }     
     else
     {
        _more_images.style.display = 'none';
     }
     
     if( result.overview != '' )
     {
        var _overview = $get('pnl_overview');
        _overview.innerHTML = result.overview;
     }
     
     if( result.properties != '' )
     {
        var _properties = $get('pnl_properties');
        _properties.innerHTML = result.properties;

     }

     if( result.sizeprices.length > 0 )
     {

        var _ddl = $get('quicklook_ddl_size_price');
        var _start = 0;
        if( result.sizeprices.length > 1 )
         {
            _ddl.options[0] = new Option("Select One...",0,true);
            _start = 1
         }

         for( var x = _start ; x < ( result.sizeprices.length + _start ) ; ++x )
         {
            var sizeprice = result.sizeprices[x - _start];
            
            _ddl.options[x] = new Option(sizeprice.Name,sizeprice.SizeID,false);
         }
         
     }

    /*******************************************/  
    /*Build Event Handlers */
     
     /**Close Button**/
     ActiveQuickLook._onCloseHandler = Function.createDelegate(ActiveQuickLook, ActiveQuickLook.hide);        
     $addHandler($get('quicklook_close'), "click", ActiveQuickLook._onCloseHandler);      
     
     /**More Images Link**/
     ActiveQuickLook._onMoreImagesHandler = Function.createDelegate(ActiveQuickLook, ActiveQuickLook._onClickMoreImages);        
     $addHandler($get('quicklook_more_images'), "click", ActiveQuickLook._onMoreImagesHandler);      
     
     /**Tab Changed Button**/
     ActiveQuickLook._tabChangedHandler = Function.createDelegate(ActiveQuickLook, ActiveQuickLook._onTabChanged);        
     $addHandler($get('tab_overview'), "click", ActiveQuickLook._tabChangedHandler);      
     $addHandler($get('tab_properties'), "click", ActiveQuickLook._tabChangedHandler);     
     $get('pnl_properties').style.display = 'none';
     
     /**Add To Cart Button**/
     ActiveQuickLook._addToCartHandler = Function.createDelegate(ActiveQuickLook, ActiveQuickLook._onAddToCart);        
     $addHandler($get('quicklook_btn_add_to_cart'), "click", ActiveQuickLook._addToCartHandler);      
     
     /**On Body Click**/
//     ActiveQuickLook._onBodyClickHandler = Function.createDelegate(ActiveQuickLook, ActiveQuickLook._onBodyClick);        
//    $addHandler(document.body, "click", ActiveQuickLook._onBodyClickHandler);      
           
     ActiveQuickLook._position()     
   },
   
   _get_data_ONERROR: function(result) {   

        var _html 
       _html = "Error while searching for product. <br />"
        + 'Message: ' + result.message
       
        var _quicklook_container = $get('quicklook')
        _quicklook_container.innerHTML = _html
   },
   
   _onAddToCart: function() {

        var _qty = ActiveQuickLook.get_inputed_quantity();
        var _size = ActiveQuickLook.get_selected_size();
        
        var _errors = '';
        
         /* Validate Inputed Values */
         
         if( _size.value == '0' )
        {
            _errors = _errors + 'Please select a size.<br />';
        }
        
        if ( !IsNumeric(_qty) || _qty == '' )
        {            
            _errors = _errors + 'Invalid Quantity';
        }
        
        if( _errors == '' )
        {
            asplants.products_ac.add_to_cart(ActiveQuickLook.get_id(), ActiveQuickLook.get_type(), _size.value, _qty, this._add_to_cart_ONSUCCESS, this._add_to_cart_ONERROR,"ADDPRODUCT");
            setTimeout('__doPostBack(\'ctl00$View_cart1$rm_view_cart\',\'\')', 0);
        }
        else
        {
            ActiveQuickLook.set_details_message(_errors);
        }
   },
   
   _add_to_cart_ONSUCCESS: function(result, eventArgs) {
           ActiveQuickLook.set_details_message(result);
   },
   
   _add_to_cart_ONERROR: function(result) {   
        ActiveQuickLook.set_details_message('Error while adding the product to your cart.  Please try again.');
   },
   
   _onTabChanged: function(e) {

        var _tabs = $get('quicklook_tabs');
       
        var _src = (e.srcElement) ? e.srcElement : e.target;       
               
        for( var x = 0; x < _tabs.childNodes.length; ++x )
        {   
            var _current_control =  _tabs.childNodes[x]
                            
                if( _current_control.tagName == 'IMG' )
                {                         
                        var _pnl = $get(_current_control.id.replace('tab_','pnl_'));
                
                       if( _pnl.id == _src.id.replace('tab_','pnl_') )
                       {
                           _pnl.style.display = 'block';
                           _current_control.src = _current_control.src.replace('_off','_on');
                       }
                       else
                       {
                           _pnl.style.display = 'none';
                           _current_control.src = _current_control.src.replace('_on','_off');
                       } 
                }   
        }  
     
   },
   
   _onClickMoreImages: function() {
        window.open(ActiveQuickLook.get_web_path() + "popup_product_images.aspx?type=" + ActiveQuickLook.get_type() + "&product="+ ActiveQuickLook.get_id(),'images','width=610, height=500,scrollbars=1,resizable=1');    
        
   }, 
   
   _onBodyClick: function(e) {
                       
//        var _quicklook_container =  $get('quicklook');
//        var quicklook_bounds = Sys.UI.DomElement.getBounds(_quicklook_container)
//        var x,y;
//        x = e.clientX;
//        y = e.clientY;
//        var _hide = false; 
//       
//        alert('Mouse x(' + x + ') y(' +  y + ') '
//        + 'Quicklook x(' +  quicklook_bounds.x + ') y(' +  quicklook_bounds.y + ') width(' +  quicklook_bounds.width + ') height(' +  quicklook_bounds.height + ')')
//        
//       
//        /*Check X Coordinates of mouse*/ 
//        if ( x < quicklook_bounds.x || x > (quicklook_bounds.x + quicklook_bounds.width) ) 
//        {
//            _hide = true
//        }
//        
//        /*Check Y Coordinates of mouse*/ 
//        if ( y < quicklook_bounds.y || y > (quicklook_bounds.y + quicklook_bounds.height) ) 
//        {
//            _hide = true
//        }
//         
//        if( _hide ) 
//        {
//            ActiveQuickLook.hide();
//        }
   },
   
   _get_quicklook_template: function() {
        var _html;
        _html = _html = '<div id=\"quicklook_header\" class=\"header\">'
        + '<a href="javascript:void(0)" id="quicklook_close" class="close_btn"></a>'
        + '<div class=\"content\">'
        + '            <div class=\"content_left\">'
        + '                <span class=\"name\" id=\"quicklook_name\"></span>'
        + '                <span class=\"subname\" id=\"quicklook_subname\"></span>'
        + '            </div>'
        + '            <div class=\"content_right\">'
        + '                <img id=\"quicklook_img\" src=\"\" /><br />'
        + '                <a href=\"javascript:void(0)\" id=\"quicklook_more_images\" class=\"more_images\">more images &gt;</a>'
        + '            </div>'
        + '        </div>'
        + '    </div>'
        + '    <div id=\"quicklook_tabs\" class=\"tabs\">'
        + '        <span class=\"left_end_seperator\">&nbsp;</span>'
        + '         <img id=\"tab_overview\" src=\"css/quicklook/quicklook_overview_on.gif\" width=\"59\" height=\"23\" class=\"tab\"/>'
        + '        <span class=\"middle_seperator\">&nbsp;</span>'
        + '         <img id=\"tab_properties\" src=\"css/quicklook/quicklook_props_off.gif\" width=\"69\" height=\"23\" class=\"tab\"/>'
        + '    </div>'
        + '    <div class=\"tab_content_seperator\">'
        + '    </div>'
        + '    <div id=\"quicklook_tab_content\" class=\"tab_content\">    '    
        + '       <div id=\"pnl_overview\">overview</div> '
        + '       <div id=\"pnl_properties\">properties</div> '
        + '    </div>'
        + '    <div id=\"quicklook_ details\" class=\"details\">'
        + '       <b><span class=\"size_price_label\" id=\"size_price_label\">Size</span></b><br />'
        + '       <select runat=\"server\" id=\"quicklook_ddl_size_price\" class=\"dropdownlist\"></select>'
        + '       <div class=\"additional_info\" id=\"quicklook_details_additional_info\"></div>'
        + '       <b>Qty:</b>&nbsp;<input type=\"text\" id=\"quicklook_tbx_quantity\" class=\"textbox\" size=\"3\" maxlength=\"4\" onkeypress=\"ActiveQuickLook.default_button(\'quicklook_btn_add_to_cart\',event)\" />&nbsp;<input type=\"button\" onclick=\"\" class=\"button\" value=\"Add to Cart\" id=\"quicklook_btn_add_to_cart\"/>'
        + '        <div class=\"message\" id=\"quicklook_details_message\"></div>'
        + '    </div>'
        
        return _html;
   },
   
   _get_loading_html: function() {
    return "<img src=\"" + ActiveQuickLook.get_web_path() + "images/loading.gif\" />&nbsp; Loading"
   }    
            
}


function activator_toggle(id, activator, state) {

   var activator_btn = $get(activator);

   if( state == 1 ) 
   {
        activator_btn.style.display = "block";
   }
   else
   {
        activator_btn.style.display = "none";
   }    
   
}

function activator_action_toggle(src, state) {

    if( state == 0 ) 
    {
        src.className = 'quicklook_activator activator_off';
    }
    else if( state == 1 )
    {
        src.className = 'quicklook_activator activator_over';
    }
   else if( state == 2 )
   {
        src.className = 'quicklook_activator activator_down';
   } 
}