Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    Regular Coder
    Join Date
    Nov 2007
    Posts
    682
    Thanks
    319
    Thanked 1 Time in 1 Post

    Review my code please

    Hey, not worked on this for a while. Anyone got any suggestions on any code I should change to make it more optimized.

    Here is a link to the page: http://martynleeball.comze.com/discount_koi/

    And the code for the main page
    PHP Code:
    <html>
    <head>
    <title>Discount Koi Aquatics</title>
    <link rel="stylesheet" type="text/css" href="css/main.css">
    <script type="text/javascript">
    function init() {
        addEvent(document.getElementById('reptiles'), "mouseover", fadeinById);
        addEvent(document.getElementById('birds'), "mouseover", fadeinById);
        addEvent(document.getElementById('fish'), "mouseover", fadeinById);
        addEvent(document.getElementById('mammals'), "mouseover", fadeinById);
        addEvent(document.getElementById('utilities'), "mouseover", fadeinById);
        
        addEvent(document.getElementById('reptiles'), "mouseout", fadeoutById);
        addEvent(document.getElementById('birds'), "mouseout", fadeoutById);
        addEvent(document.getElementById('fish'), "mouseout", fadeoutById);
        addEvent(document.getElementById('mammals'), "mouseout", fadeoutById);
        addEvent(document.getElementById('utilities'), "mouseout", fadeoutById);
    }
    //Attach listeners on page load, must be below listener calls. 
    addEvent(window,"load",init);

    //This function attaches events to elements. 
    function addEvent( elm, evt, fun ) {
        if ( elm.addEventListener ) {
            elm.addEventListener( evt, fun, false );
        } else if ( elm.attachEvent ) {
            elm.attachEvent( 'on' + evt, fun );
        } else {
            elm [ 'on' + evt ] = fun;
        }
    };

    function fadeinById(e) {
        //handle listener
        e = e || event;
        obj = e.target || e.srcElement;
        var fade_id = "tint_" + obj.id;
        
        var fade_counter = 80;
        var fade_to = 0;
        
        fade_in(fade_id, fade_counter, fade_to);
    }
    function fadeoutById(e) {
        //handle listener
        e = e || event;
        obj = e.target || e.srcElement;
        var fade_id = "tint_" + obj.id;
        
        var fade_counter = 0;
        var fade_to = 80;
        
        fade_out(fade_id, fade_counter, fade_to);
    }

    var fadeBy = 10; //Amount to fade by
    var fadeTime = 50; //Time in milliseconds to fade

    function fade_in(obj, fdCoun, fdTo) {

        var div = document.getElementById(obj);
        fdCoun -= fadeBy;
        
        div.style.filter = "alpha(opacity=" + fdCoun + ")"; //Fade (IE)
        div.style.opacity = fdCoun / 100;
        if ( fdCoun > fdTo ) {
            setTimeout( "fade_in('" + obj + "', " + fdCoun + ", " + fdTo + ")", fadeTime );
        }
    }
    function fade_out(obj, fdCoun_o, fdTo_o) {

        var div = document.getElementById(obj);

        fdCoun_o += fadeBy;
        
        div.style.filter = "alpha(opacity=" + fdCoun_o + ")"; //Fade (IE)
        div.style.opacity = fdCoun_o / 100;
        if ( fdCoun_o < fdTo_o ) {
            setTimeout( "fade_out('" + obj + "', " + fdCoun_o+ ", " + fdTo_o + ")", fadeTime );
        }
    }
    var max_slide = 32;
    var slide_by = 1;
    var slide_time = 30;
    var menu_hidden = 0;

    function hide_nav(contentToload, slide_count, title) {
        //Create global variable to say which menu was clicked
        window.page_cat = title;
        
        //Navigation div ID and content container
        var nav_id = "main_nav";
        var content_cont = "content_container";
        var div = document.getElementById(nav_id);
        
        //Display menu again once hidden
        if (menu_hidden == 1) {
            //Hide other crap first
            document.getElementById("content_container").style.display = "none";
            document.getElementById("show_menu").style.display = "none";
            
            //Now reveal the menu
            document.getElementById("main_nav").style.display = "block";
            slide_count -= slide_by;

            div.style.marginTop = "-" + slide_count + "em";
            
            if (slide_count != 0) {
                setTimeout( "hide_nav('" + contentToload + "', " + slide_count + ", '" + title + "')", slide_time);
            } else {
                //Hide everything except logo and menu
                //alert("finished: menu displayed");
                menu_hidden = 0;
            }
        //Menu is not hidden, hide it
        } else { 
            //Check that variable exists first
            if (slide_count == null) {
                var slide_count = 0;
            }
        
            slide_count += slide_by;
        
            div.style.marginTop = "-" + slide_count + "em";

            if (slide_count < max_slide) {
                setTimeout( "hide_nav('" + contentToload + "', " + slide_count + ", '" + title + "')", slide_time);
            } else {
                //alert("done");
                //Now load the next content
                load_content(contentToload);
                
                //Display main content and button to display menu again
                //First check that HTML has been loaded
                document.getElementById("content_container").style.display = "inline";
                document.getElementById("show_menu").style.display = "inline";
                fade_out("content_container", 0, 100);
                fade_out("show_menu", 0, 100);
                
                //Menu is hidden, make sure it is
                menu_hidden = 1;
                document.getElementById("main_nav").style.display = "none";
            }
        }
    }
    function load_content(page) {
        var contentCon_id = "content_container";
        
        //Get the object
        var xmlhttp = ajaxObject();


        //Fetch HTML
        xmlhttp.open("GET",page + "?page=" + page_cat, true);
        xmlhttp.send();
        
        //Change div content when loading
        xmlhttp.onreadystatechange=function() {
            if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
                document.getElementById(contentCon_id).innerHTML = xmlhttp.responseText;
            } else if (xmlhttp.status == 404) {
                document.getElementById(contentCon_id).innerHTML = "Page not found... Please contact the administrator!";
            } else if (xmlhttp.readyState == 3) {
                document.getElementById(contentCon_id).innerHTML = "Loading...";
            }
        }
    }
    function ajaxObject() {
        var xmlhttp;
        if (window.XMLHttpRequest) {
            xmlhttp=new XMLHttpRequest();
            return xmlhttp;
            //Code for Firefox, Chrome ect... so modern browsers
        } else {
            xmlhttp = new ActiveXObject('Microsoft.XMLHTTP');
            //Code for IE6, IE5
            return xmlhttp;
        }
    }

    </script>
    </head>
    <body>
    <div class="main_nav" id="main_nav">
        <?php
        
    //Create navigation HTML from XML
        
    $xmlDoc = new DOMDocument();
        
    $xmlDoc -> load("xml/homepage.xml");
        
        
    //Level 1
        
    $menu_level $xmlDoc->getElementsByTagName('menu_item');
        
    //Make variables
        
    $list = array();
        
        foreach (
    $menu_level as $item) {
            
    $x = array();
            
            if(
    $item->childNodes->length) {
                foreach(
    $item->childNodes as $i) {
                    
    $x[$i -> nodeName] = $i->nodeValue;
                }
            }
            
            
    $list[] = $x;
        }
        for (
    $g=0$g count($list); $g++) {
            echo 
    "<div class=\"nav_img\" style=\"background-image:url('".$list[$g]['image']."');\">";
            echo     
    "<div class=\"black_tint\" id=\"tint_".$list[$g]['name']."\"></div>";
            echo     
    "<a href=\"#\" class=\"nav_url_u\" onClick=\"hide_nav('".$list[$g]['pageLoad']."', '', '".$list[$g]['name']."')\">";
            echo        
    "<div class=\"nav_url ".$list[$g]['color']."\" id=\"".$list[$g]['name']."\">".$list[$g]['text']."</div>";
            echo     
    "</a>";    
            echo 
    "</div>";
        }
        
    ?>
    </div>
    <div class="show_menu" onClick="hide_nav('uh', '32')" id="show_menu"><span class="show_menu_arrow"></span> Show Menu</div>
    <div class="content_container loading" id="content_container">Loading...</div>
    <div class="logo_container">
        <img src="images/koi.png">
        <h1>DiscountKoi</h1>
        <h2>Aquatics - Reptiles - Birds - Mammels</h2>
    </div>
    </body>
    </html>
    homepage.xml
    Code:
    <?xml version="1.0"?>
    <menu>
    	<menu_item>
    		<name>reptiles</name>
    		<image>images/snake.gif</image>
    		<text>Reptiles</text>
    		<color>green</color>
    		<pageLoad>pages/categorise.php</pageLoad>
    	</menu_item>
    	<menu_item>
    		<name>birds</name>
    		<image>images/bird.gif</image>
    		<text>Birds</text>
    		<color>red</color>
    		<pageLoad>pages/categorise.php</pageLoad>
    	</menu_item>
    	<menu_item>
    		<name>fish</name>
    		<image>images/fish.gif</image>
    		<text>Fish</text>
    		<color>blue</color>
    		<pageLoad>pages/categorise.php</pageLoad>
    	</menu_item>
    	<menu_item>
    		<name>mammals</name>
    		<image>images/hamster.gif</image>
    		<text>Mammals</text>
    		<color>orange</color>
    		<pageLoad>pages/categorise.php</pageLoad>
    	</menu_item>
    	<menu_item>
    		<name>utilities</name>
    		<image>images/utilities.gif</image>
    		<text>Utilities</text>
    		<color>white</color>
    		<pageLoad>pages/categorise.php</pageLoad>
    	</menu_item>
    </menu>
    catagorise/xml (empty atm)
    Code:
    <?xml version="1.0"?>
    <categorize>
    	<reptiles>
    		
    	</reptiles>
    </categorize>
    Last edited by martynball; 01-07-2013 at 01:47 AM.


 

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •