var qty = 0;
var start_qty = 0;
var stage = 1;
var check_stage = 1;
var block_box = "details";
var ok = false;

function calculateTotal(quantity, var_id){
	var cost = Number($("pv_cost_" + var_id).value) * quantity;
    if(quantity == 0){
        $("button_add"+var_id).style.display = "none";        
    }else{
        $("button_add"+var_id).style.display = "block";
    }
	$("pv_checkout_" + var_id).innerHTML = "<strong>R</strong> " + cost.toFixed(2);
}

function openProduct(product_id){
	var bgPlatform = new Element('div', {id: 'bgplatform'});
	getwinsize();
	bgPlatform.setStyles({
		"left":"0px",
		"top":"0px",
		"z-index":"900",
		"width": (myWidth - 15) + "px",
		"height": $(window).getScrollSize().y + "px",
		"display":"block",
		"margin":"0px",
		"padding":"0px",
		"background-color":"black",
		"position":"absolute",
	});
	bgPlatform.inject(document.body);

	var platformBox = new Element('div', {id: 'platformbox'});
	platformBox.setStyles({
		"left":((myWidth - 720) / 2) + "px",
		"top": GoToTop + "px",
		"z-index":"910",
		"width": "700px",
		"height": "400px",
		"display":"none",
		"margin":"0px",
		"padding":"0px",
		"background-color":"transparent",
		"position":"absolute",
	});
	platformBox.inject(document.body);

	var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
		floatLayer(0,GoToTop,'platformbox').Fm();
	    var myRequest = new Request({
			method: 	'get',
			url:		'/giftboxes/popup/product/',
			onComplete: function(request){
					platformBox.innerHTML = request;
					platformBox.setStyles({"display":"block"});
					var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
						clicked = false;

						$("popupclose").removeEvents("click");
						$("popupclose").addEvent("click", function(){
							if(!clicked){
								clicked = true;
								var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
									platformBox.destroy();
									var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
										bgPlatform.destroy();
										clicked = false;
									}}).set(0.8);
									fadeFx.start(0);
								}}).set(1);
								newfadeFx.start(0);
							}
						});

						$("button_done").removeEvents("click");
						$("button_done").addEvent("click", function(){
							if(!clicked){
								clicked = true;
								var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
									platformBox.destroy();
									var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
										bgPlatform.destroy();
										clicked = false;
									}}).set(0.8);
									fadeFx.start(0);
								}}).set(1);
								newfadeFx.start(0);
							}
						});


					}}).set(0);
					newfadeFx.start(1);
			},
	    }).send("product_id="+product_id);
	}}).set(0);
	fadeFx.start(0.8);

	bgPlatform.addEvent("click", function(){
		if(!clicked){
			clicked = true;
			var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
				platformBox.destroy();
				var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
					bgPlatform.destroy();
					clicked = false;
				}}).set(0.8);
				fadeFx.start(0);
			}}).set(1);
			newfadeFx.start(0);
		}
	});
}


function openGiftbox(gift_id){
	var bgPlatform = new Element('div', {id: 'bgplatform'});
	getwinsize();
	bgPlatform.setStyles({
		"left":"0px",
		"top":"0px",
		"z-index":"900",
		"width": (myWidth - 15) + "px",
		"height": $(window).getScrollSize().y + "px",
		"display":"block",
		"margin":"0px",
		"padding":"0px",
		"background-color":"black",
		"position":"absolute",
	});
	bgPlatform.inject(document.body);

	var platformBox = new Element('div', {id: 'platformbox'});
	platformBox.setStyles({
		"left":((myWidth - 720) / 2) + "px",
		"top": GoToTop + "px",
		"z-index":"910",
		"width": "700px",
		"height": "400px",
		"display":"none",
		"margin":"0px",
		"padding":"0px",
		"background-color":"transparent",
		"position":"absolute",
	});
	platformBox.inject(document.body);

	var w = $("product_qty_" + gift_id).selectedIndex;
	qty = Number($("product_qty_" + gift_id).options[w].text);
	var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
		floatLayer(0,GoToTop,'platformbox').Fm();
	    var myRequest = new Request({
			method: 	'get',
			url:		'/giftboxes/popup/addbox/',
			onComplete: function(request){
					platformBox.innerHTML = request;
                    $("giftbox_success_box").style.display = "none";                    
                    $("giftbox_popup_block").style.display = "block";

                	$('formGiftbox').addEvent('submit', function(e) {
                		e.stop();
                		this.set('send', {onComplete: function(response) { 
                            $("giftbox_popup_block").style.display = "none";
                            $("giftbox_success_box").style.display = "block";
                    		var fadeFx = new Fx.Style("giftbox_success_box", 'opacity', {wait: false, duration: 500, onComplete: function(){
                                setTimeout(function(){
    								var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
    									platformBox.destroy();
    									var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
    										bgPlatform.destroy();
    									}}).set(0.8);
    									fadeFx.start(0);
    								}}).set(1);
    								newfadeFx.start(0);
                                }, 2000);
                    		}}).set(0);
                    		fadeFx.start(1);
                    	}});
                		this.send();
                    });


                    $("button_back").style.display = "none";
                    $("button_next").style.display = "none";

					platformBox.setStyles({"display":"block"});
					var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
						clicked = false;
                        stage = 1;
                        block_box = "details";

                        $("button_back").style.display = "none";
                        $("button_next").style.display = "block";
                        
                        start_qty = qty;
                        $("block_details"+stage).style.display = "block";
                        $("span_qty").innerHTML = qty;
                        $("gift_qty").value = qty;

                        var scrollfx = new Fx.Scroll('scrollerPlacement', {
                          wait: false,
                          duration: 1500,
                          offset: {'x': 0, 'y': -3},
                          transition: Fx.Transitions.Sine.easeInOut
                        });//Fx.Transitions.Quad.easeOut
                        $("box_"+stage).style.backgroundColor = "#efefef";
                        $("box_"+stage).style.border = "1px solid #808080";
                        scrollfx.toElement("box_"+stage);
                        
						$("button_next").removeEvents("click");
						$("button_next").addEvent("click", function(){
                            if(block_box == "details"){
                                check_vals = ["contact", "address", "province","city", "suburb","area", "postal"];
                                check_stage = stage;
                            }
                            if(block_box == "message"){
//                                check_vals = ["message"];
                                check_vals = [];
                                check_stage = (stage-1);
                            }
                            ok = true;
                            var err_msg = "";
                            var c=0;
                            var err_lbl = [];
                            for(i=0;i<check_vals.length;i++){
                                if($("delivery_" + check_vals[i] + check_stage).get("value") == ""){
                                    ok = false;
                                    if(check_vals[i] == "contact"){
                                        err_lbl[c] = "Name";
                                    }
                                    if(check_vals[i] == "address"){
                                        err_lbl[c] = "Address";
                                    }
                                    if(check_vals[i] == "province"){
                                        err_lbl[c] = "Province";
                                    }
                                    if(check_vals[i] == "city"){
                                        err_lbl[c] = "City";
                                    }
                                    if(check_vals[i] == "suburb"){
                                        err_lbl[c] = "Suburb";
                                    }
                                    if(check_vals[i] == "area"){
                                        err_lbl[c] = "area";
                                    }
                                    if(check_vals[i] == "postal"){
                                        err_lbl[c] = "Postal";
                                    }
                                    if(check_vals[i] == "message"){
                                        err_lbl[c] = "Your Message";
                                    }
                                    $("label_" + check_vals[i] + check_stage).style.color = "red";
                                    $("label_" + check_vals[i] + check_stage).style.fontWeight = "bold";
                                    c++;
                                }else{
                                    $("label_" + check_vals[i] + check_stage).style.color = "black";
                                    $("label_" + check_vals[i] + check_stage).style.fontWeight = "normal";
                                }
                            }
                            for(i=0;i<c;i++){
                                if(i != (c-1)){
                                    if(c != 2){
                                        err_msg += err_lbl[i] + ", ";
                                    }else{
                                        err_msg += err_lbl[i] + " ";                                        
                                    }
                                }else{
                                    if(c != 1){
                                        err_msg += "and " + err_lbl[i] + " ";                                        
                                    }else{
                                        err_msg += err_lbl[i] + " ";
                                    }
                                }
                            }
            				if(c > 1){
            					err_msg += "are ";
            				}else{
            					err_msg += "is ";
            				}
        					err_msg += "not filled in correctly.";
            				                            
                            if(ok == false){
                                alert(err_msg);
                            }
                            if(ok == true){
                                var i= 0;
                                for(i=1;i<=qty;i++){
                                    $("block_details"+i).style.display = "none";
                                    $("block_message"+i).style.display = "none";                                    
                                    $("box_"+i).style.backgroundColor = "#fff";
                                    $("box_"+i).style.border = "0px solid #fff";
                                }
                                $("box_"+stage).style.backgroundColor = "#efefef";
                                $("box_"+stage).style.border = "1px solid #808080";

                            

                                if(block_box == "message"){ 
                                    block_box = "details";
                                    if($("button_me")){
                                        $("button_me").style.display = "block";
                                    }
                                    $("block_message"+stage).style.display = "none";
                                    $("block_details"+stage).style.display = "block";
                                    scrollfx.toElement("box_"+stage);
                                }else{
                                    block_box = "message";
                                    if($("button_me")){
                                        $("button_me").style.display = "none";
                                    }
                                    $("block_message"+stage).style.display = "block";
                                    $("block_message"+stage).style.width = "400px";
                                    $("block_details"+stage).style.display = "none";
                                    stage = stage + 1;
                                }

                                $("button_back").style.display = "block";
                            
                                if((stage-1) == qty){
                                    $("button_next").style.display = "none";
                                    $("button_finish").style.display = "block";
                                }else{
                                    $("button_next").style.display = "block";
                                    $("button_finish").style.display = "none";
                                }
                            }
                        });
						$("button_back").removeEvents("click");
						$("button_back").addEvent("click", function(){
                            var i= 0;
                            for(i=1;i<=qty;i++){
                                $("block_details"+i).style.display = "none";
                                $("block_message"+i).style.display = "none";
                                $("box_"+i).style.backgroundColor = "#fff";
                                $("box_"+i).style.border = "0px solid #fff";
                            }

                            if(stage != 1){
                                if(block_box == "message"){ 
                                    block_box = "details";
                                    if($("button_me")){
                                        $("button_me").style.display = "block";
                                    }
                                    $("block_message"+(stage-1)).style.display = "none";
                                    $("block_details"+(stage-1)).style.display = "block";
                                    stage = stage - 1;
                                }else{
                                    block_box = "message";
                                    if($("button_me")){
                                        $("button_me").style.display = "none";
                                    }
                                    $("block_message"+(stage-1)).style.width = "400px";
                                    $("block_message"+(stage-1)).style.display = "block";
                                    $("block_details"+(stage-1)).style.display = "none";
                                }
                            }
                            $("button_finish").style.display = "none";
                            if(stage == 1 && block_box == "details"){
                                $("button_back").style.display = "none";
                                $("button_next").style.display = "block";
                            }else{
                                $("button_back").style.display = "block";
                                $("button_next").style.display = "block";
                            }
                            $("box_"+stage).style.backgroundColor = "#efefef";
                            $("box_"+stage).style.border = "1px solid #808080";
                            scrollfx.toElement("box_"+stage);

                        });

						$("popupclose").removeEvents("click");
						$("popupclose").addEvent("click", function(){
							if(!clicked){
								clicked = true;
								var newfadeFx = new Fx.Style(platformBox, 'opacity', {wait: false, duration: 500, onComplete:function(){
									platformBox.destroy();
									var fadeFx = new Fx.Style(bgPlatform, 'opacity', {wait: false, duration: 500, onComplete:function(){
										bgPlatform.destroy();
										clicked = false;
									}}).set(0.8);
									fadeFx.start(0);
								}}).set(1);
								newfadeFx.start(0);
							}
						});
					}}).set(0);
					newfadeFx.start(1);
			},
	    }).send("gift_id="+gift_id + "&qty=" + qty);
	}}).set(0);
	fadeFx.start(0.8);
}

function remove_qty(){
	var answer = confirm("Are you sure you want to remove a giftbox? Please note: When you delete a box, it deletes the last box on this list, Not this 'selected' box.")
	if (answer){
        var i= 0;
        for(i=1;i<=qty;i++){
            $("block_details"+i).style.display = "none";
            $("block_message"+i).style.display = "none";
            $("box_"+i).style.backgroundColor = "#fff";
            $("box_"+i).style.border = "0px solid #fff";
        }
        block_box = "details";
        stage = 1;
        check_stage = 1;
        $("box_"+stage).style.backgroundColor = "#efefef";
        $("box_"+stage).style.border = "1px solid #808080";
        $("block_message"+stage).style.display = "none";
        $("block_details"+stage).style.display = "block";

        if($("button_me")){
            $("button_me").style.display = "block";
        }
        $("button_back").style.display = "none";
        $("button_next").style.display = "block";

        var scrollfx = new Fx.Scroll('scrollerPlacement', {
          wait: false,
          duration: 1500,
          offset: {'x': 0, 'y': -3},
          transition: Fx.Transitions.Sine.easeInOut
        });//Fx.Transitions.Quad.easeOut
        scrollfx.toElement("box_"+stage);

        qty = qty - 1;
        $("span_qty").innerHTML = qty;
        $("gift_qty").value = qty;
        if(qty == 0){
            $("popupclose").fireEvent("click");
        }
        $("box_"+(qty+1)).destroy();
	}
}