﻿/************************************************************
 *     Эффекты
 *
 *     Автор:                     Агроник А.Ю.
 *     Дата создания:             18.08.2007
 *
 ************************************************************/
 
 $slider = 
 {
    stop:false,
    Center:function(obj)
    {
        if(!this.stop)
        {
            var parent = $global.GET(obj, "up:1");
            var frame = $global.GET(parent, "up:1");
            var x0 = parseInt(parent.style.left);
            var thisx = obj.offsetLeft+x0;
            var centerx = Math.round(frame.clientWidth/2-obj.clientWidth/2);
            var disp = centerx - thisx;
// тут можно скорость подкрутить
            var time = Math.round(Math.abs(500*disp/300));
            $effect.Time(time).SlideH(parent, disp, disp > 0 ? 0 : -(parent.clientWidth-frame.clientWidth));
        }
    },
    RightArrow_ClickHandler:function(obj)
    {
        if(!this.stop)
        {
            var frame = $global.GET(obj, "up:2,div:1"); // тут чуть-чуть поменял
            var parent = $global.GET(frame, "div:0");

            var x0 = parseInt(parent.style.left);
            var border = -(parent.clientWidth-frame.clientWidth);
            var a = x0-300 > border ? x0-300: border; // почему 300? хз, но работает :)
            var images = $global.GetElementsByTagName(parent, "div"); // тут тоже поменял
            for(var i = 0;i<images.length;i++)
            {
                var img = images[i];
                if(img.offsetWidth+img.offsetLeft > Math.abs(a)+frame.clientWidth)
                {
                    this.Center(img);
                    break;
                }
            }
        }
    },
    LeftArrow_ClickHandler:function(obj)
    {
        if(!this.stop)
        {
            var frame = $global.GET(obj, "up:2,div:1");
            var parent = $global.GET(frame, "div:0");
            var x0 = parseInt(parent.style.left);
            var border = 0;
            var a = x0+300 < border ? x0+300: border;
            var images = $global.GetElementsByTagName(parent, "div");
            for(var i = 0;i<images.length;i++)
            {
                var img = images[i];
                if(img.offsetWidth+img.offsetLeft+a > 0)
                {
                    this.Center(img);
                    break;
                }
            }
        }
    },
    LoaderStart:function(onShow)
    {
        var obj = document.getElementById("PageLoaderGif");
        if(!obj)
        {
            obj = document.createElement("div");
            obj.className = "PageLoader";
            var img = document.createElement("img");
            img.src = "resource/ajax-loader.gif";
            img.alt = "Загрузка";
            obj.appendChild(img);
            obj.style.display = "none";
            obj.id = "PageLoaderGif";
            document.body.appendChild(obj);
        }
        $global.Display.Block(obj);
        if(onShow)
            onShow(obj);
    },
    LoaderEnd:function(onEnd)
    {
        var obj = document.getElementById("PageLoaderGif");
        if(obj)
        {
            $global.Display.Hide(obj);
            if(onEnd)
                onEnd(obj);
        }
    },
    ColorClick:function(o)
    {
        if(o)
        {           
            this.SelectedColor = o.id.replace("color_scheme::", "");
            var _bigImage = document.getElementById("BigImage");
            if(_bigImage)
            {
                var align = function(img)
                {
                    var pos = $global.FindPosition(_bigImage);
                    img.style.top = (pos[1]+225)+"px";
                    img.style.left = (pos[0]+225)+"px";
                }
                var end = function(obj)
                {
                    $slider.LoaderStart(align);
                    obj.onload = function(){ $effect.Time(500).FadeIn(obj); $slider.LoaderEnd(); };
                    obj.src = $global.GetAttribute(o, "big");
                }
                $effect.Time(500).FadeOut(_bigImage, end);
            }
        }
    },
    Image_Click:function(obj)
    {
        if(!this.stop)
        {
            if(obj)
            {
                var _effectEnded = false;
                var _loadEnded = false;
                this.stop = true;
                var xml;
                var showCard = function(obj)
                {
                    $slider.LoaderStart(function(img){ $global.ShowInPageCenterByBounds(img, 50, 50); });
                    this.stop = false;
                    var card = document.getElementById("ItemCard");
                    if(card)
                    {
                        if(xml)
                        {
                            //Информация
                            var title = $global.GET(card, "div:0,h3:0");
                            title.innerHTML = $global.GetAttribute(xml, "title");
                            var desc = $global.GET(card, "div:1");
                            desc.innerHTML = $global.GetAttribute(xml, "description");
                            //Цветовые схемы
                            var colors = xml.getElementsByTagName("color");
                            var schemes = $global.GET(card, "div:3,div:0");
                            //Операции
                            $global.GET(schemes, "up:1,a:0").href = "http://" + $global.GetAttribute(xml, "tempPath")+ ".rapidsite.ru";
                            $global.GET(schemes, "up:1,a:0").target = "_blank";
                            $global.GET(schemes, "up:1,a:1").href = "#";
                            //
                            schemes.innerHTML = "";
                            for(var i=0;i<colors.length;i++)
                            {
                                var color = colors[i];
                                var id = $global.GetAttribute(color, "Id");
                                var title = $global.GetAttribute(color, "title");
                                var _small = $global.GetAttribute(color, "smallImg");
                                var _big = $global.GetAttribute(color, "bigImg");
                                var img = document.createElement("img");
                                img.src = _small;
                                img.alt = title;
                                img.setAttribute("big", _big);
                                img.id = "color_scheme::" + id;
                                img.onclick = function(){ $slider.ColorClick(this); };
                                schemes.appendChild(img);
                            }
                            schemes.appendChild($global.GetClear());
                            var small = $global.GET(card, "div:0,img:0");
                            small.src = $global.GetAttribute(xml, "smallImg");
                            var big = $global.GET(card, "img:last");
                            big.onload = function() 
                            {
                                $global.SetOpacity(card, 0);
                                $global.Display.Clear(card);
                                $slider.LoaderEnd();
                                $effect.Time(500).FadeIn(card, function(){ $global.ClearOpacity(card);document.getElementById("clearer").style.display = "none"; });
                            };
                            if(colors.length > 0)
                            {
                                big.src = $global.GetAttribute(colors[colors.length-1], "bigImg");
                                $slider.SelectedColor = $global.GetAttribute(colors[colors.length-1], "Id");
                            }
                        }
                    }
                }
                var end = function(req)
                {
                    xml = req.responseXML.firstChild
                    _loadEnded = true;  
                    if(_effectEnded)
                        showCard(); 
                }
                var effectEnd = function(obj)
                {
                    $global.Display.Hide(obj.parentNode);                  
                    _effectEnded = true;   
                    if(_loadEnded)
                        showCard();
                }
                var request = new Request();
                document.getElementById("clearer").style.display = "block";
                request.Send("Response.ashx", end, function(){}, "action=getInfo&catId=1&itemId="+obj.id.replace('slider_img::', ''));
                var divs = $global.GetElementsByTagName($global.GET(obj, "up:3"), "div");
                this.SelectedTemplate = obj.id.replace("slider_img::", "");
                for(var i=0;i<divs.length;i++)
                    $effect.Time(500).FadeOut(divs[i], effectEnd);
      
            }
        }
    },
    SelectedTemplate:-1,
    SelectedColor:-1,
    NextClick:function()
    {
		//alert("step3.aspx?template="+this.SelectedTemplate+"&color="+this.SelectedColor);
        document.location = "step2.aspx?template="+this.SelectedTemplate+"&color="+this.SelectedColor;
    }  
 }
 function BackButton_ClickHandler(obj)
 {
    if(obj)
    {
        var card = obj.parentNode;
        if(card)
        {
            var slider = $global.GET(card.parentNode, "div:1");
            var end = function(obj)
            {
                $global.Display.Hide(obj);
                $global.Display.Clear(slider);
                var parts = $global.GetElementsByTagName(slider, "div");
                for(var i=0;i<parts.length;i++)
                    $effect.Time(500).FadeIn(parts[i], function(){ $slider.stop = false; });
            }
            $effect.Time(500).FadeOut(card, end);  
        }
    }
 }
