var m_url = "DataPage.aspx";

        function onHtabClick(target) {
            hideAllViews();
            setLoaderVisible(true);
            //$("#bigImage").css("display", "none");
            var clickTag = target;
            if (clickTag == null) {
                alert("done");
                return;
            }
            setHTabLinkActive(target)
            $.ajax({
                type: "GET",
                url: "DataPage.aspx?action=getHXml&item=" + clickTag + "&collection=" + m_collection,
                dataType: "xml",
                success: onHItemResult
            });
        }

        function onHItemResult(xml) {
            prepareStepsContent(xml);
            var subs = $(xml).find("Subitem").text();
            var isSimple = (subs == null || subs == '');
            if (isSimple) {
                fillPlainData(xml);
            }
            else {
                processComplexData(xml);
            }
            switchView(!isSimple);
            setLoaderVisible(false);
        }

        function fillPlainData(xml) {
            var name = $(xml).find("Item").attr("Name");
            var icon = $(xml).find("Item").attr("Icon");
            var image = $(xml).find("Item").attr("Image");
            var content = $(xml).find("Content").text();
            var descr = $(xml).find("Description").text();
            document.getElementById("descrHead").innerHTML = name;
            document.getElementById("descrContent").innerHTML = descr;
            //document.getElementById("bigImage").setAttribute("src", image);
            //document.getElementById("bigImage").setAttribute("alt", name);
            document.getElementById("divSteps").innerHTML = content;
            var iconDiv = document.getElementById("divDesc");
            $("#divDesc").css("background-image", "url(" + resolvedImage(image) + ")");
            $("#divIcon").attr("src", resolvedImage(icon));
            //iconDiv.style.backgroundImage = "url('" + icon + "')";
        }

        function setHTabLinkActive(name) {
            $("#hTabs").find(".hcurrent").each(function(i) {
                $(this).removeAttr("class");
            });
            $("#lnk" + name.toString().replace(" ","_")).attr("class", "hcurrent");

        }

        function onHtabComplete(result) {
            onSimpleTab(result);
        }

        function switchView(simple) {
            if (simple) {
                var div = document.getElementById("divDesc");
                div.style.display = "none";
                document.getElementById("divVContent").style.display = "block";
            }
            else {
                document.getElementById("divVContent").style.display = "none";
                document.getElementById("divDesc").style.display = "block";
            }
            //document.getElementById("bigImage").style.display = "block";
        }

        function hideAllViews() {
            document.getElementById("divVContent").style.display = "none";
            document.getElementById("divDesc").style.display = "none";
            //document.getElementById("bigImage").style.display = "none";
            //$("#bigImage").css("display", "none");
        }

        function setLoaderVisible(visible) {

            var dis = visible ? "block" : "none";
            $("#pContent").find("#imgLoad").css("display", dis);
            return;
            document.getElementById("imgLoad").style.display = dis;
            document.getElementById("imgLoad").setAttribute("visible", visible);
        }


        var currentXmlNode = null;

        function processComplexData(xml) {
            currentXmlNode = xml;
            $("#vTabs").find("li.pasted").remove();
            $(xml).find("Subitem").each(
                function(i) {
                    var nodeName = $(this).attr("Name");
                    var tabText = $(this).attr("TabText");
                    addVTab(nodeName, resolvedImage(tabText));
                }
            );
                var firstId = $("#vTabs").find("li.pasted:first").find("a:first").attr("id");
                setActiveVTab(firstId);
        }


        function addVTab(name, tabText) {
            var str = '<li class="pasted"><a id="' + replaceAllEntries(name, " ", "_") + '" class="nonactive" onclick=\'setActiveVTab("' + replaceAllEntries(name, " ", "_") + '");return false;\' href="javascript:void(0)"><img class="text" src="' + tabText + '" alt="' + name + '" /></a></li>';
            //var str = '<li class="pasted"><span id="' + replaceAllEntries(name, " ", "_") + '" class="nonactive" onclick=\'setActiveVTab("' + replaceAllEntries(name, " ", "_") + '")\' ><img class="text" src="' + tabText + '" alt="' + name + '" /></span></li>';
            $("#liFinal").before(str);
        }

        function replaceAllEntries(str, oldExp, newExp) {
            var arr = str.toString().split(oldExp);
            var newStr = '';
            for (var i = 0; i < arr.length; i++) {
                newStr += arr[i];
            }
            return newStr;
        }

        function setActiveVTab(name) {
            $("#vTabContent").css("background-image", "none");
            $("#vTabs").find("a").attr("class", "nonactive");
            $("#vTabs").find(".activetext").attr("class","text")
            $("#vTabs").find("#" + name).attr("class", "active");
            var target = $("#" + name).find(".text").attr("alt");
            $("#" + name).find(".text").attr("class","activetext");
            pasteSubItemData(target);
            return false;
        }

        function pasteSubItemData(target) {
            if (currentXmlNode == null) {
                return;
            }
            var content = $(currentXmlNode).find("Subitem[Name='" + target + "']").find("Content").text();
            $("#vTabContent").find("p.heading").html(target);
            $("#divVContentBody").html(content);
            var image = $(currentXmlNode).find("Subitem[Name='" + target + "']").attr("Image");
            $("#vTabContent").css("background-image", "url(" + resolvedImage(image) + ")");
            //$("#bigImage").attr("src", image);
            //$("#bigImage").attr("alt", target);
        }

        function resolvedImage(name) {
            return m_resolvedPath + name;
        }

        function bigImageLoaded(loaded) {
            //$("#bigImage").css("display", "block");
        }

        function s() {
        }

        function prepareStepsContent(xml) {
            prepareStepNodes(xml, "Subitem");
            prepareStepNodes(xml, "Item");
            //xml.getElementsByTagName("Content")[0].nodeValue = xml.createCDATASection(xml.getElementsByTagName("Content")[0].text.replace("[PASTE_STEPS_HERE]", node.nodeValue + "<br/> ")).nodeValue;
        }

        function prepareStepNodes(xml, nodeName) {
            $(xml).find(nodeName).each(function(i) {
                var shouldReturn = $(this).find("Subitem").length > 0;
                if (shouldReturn) {
                    return;
                }
                var node = xml.createElement("ReadyStepps");
                $(this)[0].appendChild(node);
                $(this).find("Step").each(function(i) {
                    var stepH = $(this).find("StepHead").text();
                    var stepB = $(this).find("StepBody").text();
                    var prepared = "<div><div class='stephead'>" + stepH + "</div>" +
                       "<div class='stepbody'>" + stepB + "<br/><br/></div></div>";
                    //var prepared = "<div style='padding-left:30px'><div class='stephead'>" + stepH + "</div>" + stepB + "</div>";
                    node.appendChild(xml.createCDATASection(prepared));
                });
                var oldStr = $(this).find("Content").text();
                //alert(oldStr);
                var newStr = oldStr.replace("[PASTE_STEPS_HERE]", $(node).text() + "<br/>");
                $(this).find("Content").text(newStr);
            });
        }

        function test(i) {
            $(this).text("<![CDATA[ <div class='stepbody'>" + $(this).text() + "</div> ]]>");
        }

        function fillStepHolder(i) {
            
        }