﻿// set up drop downs anywhere in the body of the page. I think the bottom of the page is better.. 
// but you can experiment with effect on loadtime.
if (mtDropDown.isSupported()) {

    //==================================================================================================
    // create a set of dropdowns
    //==================================================================================================
    // the first param should always be down, as it is here
    //
    // The second and third param are the top and left offset positions of the menus from their actuators
    // respectively. To make a menu appear a little to the left and bottom of an actuator, you could use
    // something like -5, 5
    //
    // The last parameter can be .topLeft, .bottomLeft, .topRight, or .bottomRight to inidicate the corner
    // of the actuator from which to measure the offset positions above. Here we are saying we want the 
    // menu to appear directly below the bottom left corner of the actuator
    //==================================================================================================
    var ms = new mtDropDownSet(mtDropDown.direction.down, 0, 0, mtDropDown.reference.bottomLeft);

    //==================================================================================================
    // create a dropdown menu
    //==================================================================================================
    // the first parameter should be the HTML element which will act actuator for the menu
    //==================================================================================================
    var menu1 = ms.addMenu(document.getElementById("menu1"));
    menu1.addItem("Blenders", "products.aspx?category=1");
    menu1.addItem("Parts", "products.aspx?category=2");
    menu1.addItem("Mixers", "products.aspx?category=3");
    menu1.addItem("Mills", "products.aspx?category=4");

    var menu2 = ms.addMenu(document.getElementById("menu2"));
    menu2.addItem("Blender Recipes", "recipes.aspx?maincatagory=1");
    menu2.addItem("Mix & Blend Recipes", "recipes.aspx?maincatagory=3");
    menu2.addItem("Kitchen Mill Recipes", "recipes.aspx?maincatagory=4");
    menu2.addItem("Naughty But Nice Recipes", "recipes.aspx?maincatagory=5");

    var menu3 = ms.addMenu(document.getElementById("menu3"));
    menu3.addItem("Contact Us", "contactus.aspx");
    menu3.addItem("Return Policy", "returnpolicy.aspx");
    menu3.addItem("Testimonials", "testimonials.aspx");
    menu3.addItem("FAQ", "FAQ.aspx");
    menu3.addItem("Product Registration", "productregistration.aspx");
    menu3.addItem("My Profile", "profile.aspx");
    menu3.addItem("Site Map", "sitemap.aspx");

    var menu4 = ms.addMenu(document.getElementById("menu4"));
    menu4.addItem("Videos", "demos.aspx");
    menu4.addItem("Live Demos", "roadshows.aspx");
    menu4.addItem("Healthy Living", "healthyliving.aspx");
    menu4.addItem("Jar Safety Information", "resources.aspx");




    //==================================================================================================

    //==================================================================================================
    // add a sub-menu
    //==================================================================================================
    // to add a sub menu to an existing menu object, call it's addMenu method and pass it the item from
    // the parent menu which should act as it's actuator. To add a submenu to the fourth item of a menu
    // called "theMenu", you would do theMenu.addMenu(theMenu.items[3])
    //==================================================================================================



    //==================================================================================================
    // write drop downs into page
    //==================================================================================================
    // this method writes all the HTML for the menus into the page with document.write(). It must be
    // called within the body of the HTML page.
    //==================================================================================================
    mtDropDown.renderAll();
}
