Skip to content

Instantly share code, notes, and snippets.

@aek

aek/index.htm

Created November 21, 2011 22:31
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save aek/1384181 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save aek/1384181 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. aek created this gist Nov 21, 2011.
    114 changes: 114 additions & 0 deletions index.htm
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,114 @@
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
    <title>ArcheType</title>

    <!-- include the jx delicious skin -->
    <link rel="stylesheet" href="../js/mootools/jxlib/themes/delicious/jxtheme.css" type="text/css" media="screen" charset="utf-8">
    <!-- IE specific style sheets -->
    <!--[if LTE IE 6]>
    <link rel="stylesheet" href="../js/mootools/jxlib/themes/delicious/ie6.css" type="text/css" media="screen" charset="utf-8">
    <![endif]-->
    <!--[if IE 7]>
    <link rel="stylesheet" href="../js/mootools/jxlib/themes/delicious/ie7.css" type="text/css" media="screen" charset="utf-8">
    <![endif]-->

    <link rel="shortcut icon" href="../img/common/favicon.png" type="image/x-icon">

    <script type="text/javascript" src="../js/mootools/mootools-core.js"></script>
    <script type="text/javascript" src="../js/mootools/mootools-more.js"></script>

    <!-- include the jx library -->
    <script type="text/javascript" src="../js/mootools/jxlib/jxlib.uncompressed.js" charset="utf-8"></script>

    <script type="text/javascript" src="../js/mootools/jxlib/Jx.JsonStore.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/mootools/jxlib/Jx.Charts.js" charset="utf-8"></script>

    <script type="text/javascript" src="../js/mootools/jxlib/common.js" charset="utf-8"></script>
    <script type="text/javascript" src="../js/rsh.js" charset="utf-8"></script>
    </head>
    <body>
    <div id="thePage">
    <div id="ventana" style="display: none;"></div>
    <div id="Headerx" style="display: none;">
    <div id="header">
    <img style="float:left" src="../img/common/banner.png" width="100%" height="90">
    </div>
    </div>
    <iframe id="iframe" name="iframe" style="display: none;"></iframe>

    <form id="dform" method="post" target="iframe" action="">
    <input type="text" name="query" style="display: none;">
    </form>

    </div>
    <script type="text/javascript">
    window.addEvent('domready',function(){

    //I'm using the new class Jx.Adaptor.Tree.Object in the 3.1
    var treeMenuAdaptor = new Jx.Adaptor.Tree.Object({
    protocol: new Jx.Store.Protocol.Ajax({
    urls: {
    read: '../common/menu.htm'
    },
    parser: new Jx.Store.Parser.JSON(),
    dataProperty: 'items'
    }),
    folderOptions: {
    open: true
    },
    /*
    labelProperty is a change similar to dataProperty in Jx.Store.Protocol.Ajax
    to configure the property of the label in the objects of the response data
    */
    labelProperty: 'text'
    });

    new Jx.Container({
    items:[
    //others panels that don't matters here.
    {
    class: Jx.Panel,
    id: 'menuPanel',
    label: 'Menu',
    collapse: false,
    width: 200,
    content: new Jx.Tree({
    plugins: [
    treeMenuAdaptor
    ],
    onSelect: function(item){
    //I modify a little Jx.Adaptor.Tree.Object to pass an attributes option
    //with the attributes property of the data objects, only to store in the options
    var attr = item.options.attributes;
    if(attr!== null && attr!=='undefined' && attr.url){
    //send a Request to load a view in the workView
    archetype.loadView(attr.url);
    }
    }
    }),
    layoutOpts: {
    top: 120,
    width: 300
    }
    },
    {
    class: Jx.Panel,
    id: 'workView',
    hideTitle: true,
    layoutOpts: {
    top: 120,
    left: 205
    }
    }]
    }).addTo('thePage');

    treeMenuAdaptor.load();
    new Jx.Layout('thePage');
    });

    </script>
    </body>
    </html>