function findPos(obj) {
    var curleft = curtop = 0;
    if (obj.offsetParent) {
        do {
            curleft += obj.offsetLeft;
            curtop += obj.offsetTop;
        } while (obj = obj.offsetParent);
        var p = new Object();
        p.left = curleft;
        p.top = curtop;
        return p;
    }
}

function createFlexRuleMainMenu() {

    // initModelItems();
    /***
    This is the menu creation code - place it right after you body tag
    Feel free to add this to a stand-alone js file and link it to your page.
    **/

    //Menu object creation
    oCMenu = new makeCM("oCMenu") //Making the menu object. Argument: menuname

    oCMenu.frames = 0

    var tbl = document.getElementById('mainTableId');
    var pos = findPos(tbl);
    var leftPos = (pos.left + 10).toString();
    oCMenu.onresize = "oCMenu.fromLeft=!bw.moz?((cmpage.x2 - 775)/2+ 20):((cmpage.x2 - 775)/2+ 20)"
    //oCMenu.onresize = "oCMenu.fromLeft=!bw.moz?" + leftPos + ":" + leftPos;

    //Menu properties
    oCMenu.pxBetween = 0
    oCMenu.fromLeft = !bw.moz ? ((cmpage.x2 - 775) / 2) + 20 : ((cmpage.x2 - 775) / 2) + 20; // pos.left+10
    oCMenu.fromTop = 250
    oCMenu.rows = 2
    oCMenu.menuPlacement = "left"

    oCMenu.offlineRoot = ""
    oCMenu.onlineRoot = ""
    oCMenu.resizeCheck = true
    oCMenu.wait = 500
    oCMenu.fillImg = "cm_fill.gif"
    oCMenu.zIndex = 0

    //Background bar properties
    oCMenu.useBar = 1
    oCMenu.barWidth = "menu"
    oCMenu.barHeight = "0"
    oCMenu.barClass = "clBar"
    oCMenu.barX = 0
    oCMenu.barY = 0
    oCMenu.barBorderX = 0
    oCMenu.barBorderY = 0
    oCMenu.barBorderClass = ""

    //Level properties - ALL properties have to be spesified in level 0
    oCMenu.level[0] = new cm_makeLevel() //Add this for each new level
    oCMenu.level[0].width = 80
    oCMenu.level[0].height = 20
    oCMenu.level[0].regClass = "clLevel0"
    oCMenu.level[0].overClass = "clLevel0over"
    oCMenu.level[0].borderX = 0
    oCMenu.level[0].borderY = 0
    oCMenu.level[0].borderClass = "clLevel0border"
    oCMenu.level[0].offsetX = 0
    oCMenu.level[0].offsetY = 0
    oCMenu.level[0].rows = 0
    oCMenu.level[0].arrow = 0
    oCMenu.level[0].arrowWidth = 0
    oCMenu.level[0].arrowHeight = 0
    oCMenu.level[0].align = "bottom"
    oCMenu.level[0].zIndex = 10;

    //EXAMPLE SUB LEVEL[1] PROPERTIES - You have to specify the properties you want different from LEVEL[0] - If you want all items to look the same just remove this
    oCMenu.level[1] = new cm_makeLevel() //Add this for each new level (adding one to the number)
    oCMenu.level[1].width = 120
    oCMenu.level[1].height = 20
    oCMenu.level[1].regClass = "clLevel1"
    oCMenu.level[1].overClass = "clLevel0over"
    oCMenu.level[1].borderX = 1
    oCMenu.level[1].borderY = 1
    oCMenu.level[1].align = "right"
    oCMenu.level[1].borderClass = "clLevel1border"
    oCMenu.level[1].offsetX = 0
    oCMenu.level[1].offsetY = 0
    oCMenu.level[1].rows = 0
    oCMenu.level[1].arrow = "/images/arrow.gif"
    oCMenu.level[1].arrowWidth = 10
    oCMenu.level[1].arrowHeight = 10
    oCMenu.level[1].zIndex = 20;

    /******************************************
    Menu item creation:
    myCoolMenu.makeMenu(name, parent_name, text, link, target, width, height, regImage, overImage, regClass, overClass , align, rows, nolink, onclick, onmouseover, onmouseout)
    *************************************/
    
    oCMenu.makeMenu('top8', '', ' Features', '', '')
    oCMenu.makeMenu('sub80', 'top8', 'Overall Overview', '/framework/features/general.aspx', '', 180)
    oCMenu.makeMenu('sub81', 'top8', 'Connecting to Rule', '/framework/features/connections.aspx', '', 180)
    oCMenu.makeMenu('sub82', 'top8', 'Extensibility and Activation', '/framework/features/engine.aspx','',180)
    oCMenu.makeMenu('sub83', 'top8', 'Rule Modularity and Reuse', '/framework/features/modularity.aspx', '', 180)

    oCMenu.makeMenu('sub84', 'top8', 'Engines', '', '', 180)
        oCMenu.makeMenu('sub85', 'sub84', 'Procedure', '')
            oCMenu.makeMenu('sub8411', 'sub85', 'Overview', '/framework/features/procedure.aspx')
            oCMenu.makeMenu('sub8412', 'sub85', 'Samples', '/framework/features/procedure-samples.aspx')

        oCMenu.makeMenu('sub89', 'sub84', 'Inference', '')
            oCMenu.makeMenu('sub8421', 'sub89', 'Overview', '/framework/features/inference.aspx')
            oCMenu.makeMenu('sub8422', 'sub89', 'Samples', '/framework/features/inference-samples.aspx')

        oCMenu.makeMenu('sub91', 'sub84', 'RuleFlow', '/framework/features/ruleflow.aspx')

    oCMenu.makeMenu('sub86', 'top8', 'Power Shell', '/framework/features/PowerShell.aspx', '', 180)
    oCMenu.makeMenu('sub87', 'top8', 'Debugger', '/framework/features/debugger.aspx', '', 180)
    oCMenu.makeMenu('sub88', 'top8', 'Designer', '/designer/features', '', 180)
    

    oCMenu.makeMenu('top0', '', ' Product')
    oCMenu.makeMenu('top01', 'top0', 'Compare Editions', 'javascript:showCompareTable();')
    oCMenu.makeMenu('top02', 'top0', 'Customers', 'javascript:showCustomers();', '')
            
    oCMenu.makeMenu('top2', '', ' Download')
    oCMenu.makeMenu('top21', 'top2', 'Presentation', '/Presentation.aspx', '')
    oCMenu.makeMenu('top22', 'top2', 'Technical Document', 'http://www.pliantframework.com/portal/SharedFiles/Download.aspx?pageid=15&mid=20&fileid=2', '')

    oCMenu.makeMenu('top3', '', ' Contacts')
    oCMenu.makeMenu('sub31', 'top3', 'Info', 'mailto:info@flexrule.com')
    oCMenu.makeMenu('sub32', 'top3', 'Sales', 'mailto:sales@flexrule.com')

    oCMenu.makeMenu('top4', '', ' Sites')
    oCMenu.makeMenu('sub40', 'top4', 'Home', 'http://www.flexrule.com', '')
    oCMenu.makeMenu('sub41', 'top4', 'Right Sentinel', 'http://www.rightsentinel.com', '_blank')
    oCMenu.makeMenu('sub42', 'top4', 'Pliant Framework', 'http://www.pliantframework.com.au', '_blank')

    //Leave this line - it constructs the menu
    oCMenu.construct();
}

function showCustomers() {
    $.blockUI(
        { message: $('#msgCustomers'),
            css: {
                top: '20%',
                left: ($(window).width() - 500) / 2 + 'px',
                width: '500px',
                cursor: ''
            }
        }
    );
}


function showCompareTable() {
    $.blockUI(
        { message: $('#msgCompareTable'),
            css: {
                top: '10%',
                left: ($(window).width() - 700) / 2 + 'px',
                width: '700px',
                height: '470px',
                cursor: ''
            }
        }
    );
}