Fix #5660 - roojs docs - linking and other tidy ups

diff --git a/docs/Roo.docs.bjs b/docs/Roo.docs.bjs
index 5549744..9f51832 100644 (file)
--- a/docs/Roo.docs.bjs
+++ b/docs/Roo.docs.bjs
@@ -32,12 +32,11 @@
    "items" : [
     {
      "listeners" : {
-      "render" : "function (_self)\n{\n  //  this.el.addClass(language);\n    \n}"
+      "render" : "function (_self)\n{\n  _this.sidebar = this;\n  //  this.el.addClass(language);\n    \n}"
      },
      "String cls" : "left-menu-sidebar",
      "xtype" : "NavSidebar",
      "$ xns" : "Roo.bootstrap",
-     "String style" : "padding-top:80px;",
      "items" : [
       {
        "listeners" : {
@@ -58,7 +57,7 @@
          "items" : [
           {
            "listeners" : {
-            "click" : "function (e)\n{\n    document.location.reload();\n}"
+            "click" : "function (e)\n{\n    document.location.hash = '#';\n}"
            },
            "string href" : "#",
            "String cls" : "logo",
@@ -89,8 +88,8 @@
       "render" : "function (_self)\n{\n    return;\n    \n    _this.navHeaderBar = this;\n    \n    this.el.addClass(language); \n    \n    var body = Roo.select('body', true).first();\n    \n    var mark = {\n        tag: \"div\",\n        cls:\"x-dlg-mask\"\n    };\n    \n    this.mask = Roo.DomHelper.append(body, mark, true);\n    \n    var size = body.getSize();\n    this.mask.setSize(size.width, size.height);\n    \n    this.mask.setStyle('z-index', '1029');\n    \n    this.mask.enableDisplayMode(\"block\");\n    this.mask.hide();\n    \n    this.mask.on('click', function(){\n        \n        this.el.select('.navbar-collapse',true).removeClass('in'); \n        this.mask.hide();\n        \n    }, this);\n    \n    \n    var maxHeight = Roo.lib.Dom.getViewHeight() - this.el.select('.navbar-header', true).first().getHeight();\n    \n    this.el.select('.navbar-collapse', true).first().setStyle('max-height', maxHeight);\n    \n}"
      },
      "$ String brand_href" : "baseURL + '/'",
-     "String position" : "fixed-top",
      "String cls" : "mobile-header-menu",
+     "String position" : "fixed-top",
      "bool autohide" : true,
      "xtype" : "NavHeaderbar",
      "Boolean inverse" : false,
@@ -108,8 +107,8 @@
      "items" : [
       {
        "xtype" : "Header",
-       "Number level" : 1,
        "$ xns" : "Roo.bootstrap",
+       "Number level" : 1,
        "String html" : "Roo JS Documentation"
       },
       {
@@ -147,8 +146,8 @@
            "items" : [
             {
              "xtype" : "Header",
-             "Number level" : 4,
              "$ xns" : "Roo.bootstrap",
+             "Number level" : 4,
              "String html" : " Class ",
              "items" : [
               {
@@ -175,10 +174,10 @@
                 {
                  "listeners" : {
                   "render" : "function (_self)\n{\n    _this.doc_extends = this;\n}",
-                  "click" : "function (e)\n{\n\n    if (this.el.dom.innerHTML.length) {\n        Roo.docs.init.loadDoc({ name : this.el.dom.innerHTML, is_class : true});\n    }\n}"
+                  "click" : "function (e)\n{\n\n    if (this.el.dom.innerHTML.length) {\n        document.location.hash = '#' +  this.el.dom.innerHTML;\n      \n    } \n}"
                  },
                  "String cls" : "doc-extends",
-                 "Boolean preventDefault" : false,
+                 "Boolean preventDefault" : true,
                  "xtype" : "Link",
                  "$ xns" : "Roo.bootstrap",
                  "String html" : "parentcls"
@@ -189,8 +188,8 @@
             },
             {
              "xtype" : "Header",
-             "$ xns" : "Roo.bootstrap",
              "Number level" : 5,
+             "$ xns" : "Roo.bootstrap",
              "String html" : "Defined in: ",
              "items" : [
               {
@@ -199,8 +198,8 @@
                 "click" : "function (e)\n{\n    \n    Roo.log([\"click\", this]);\n    if (this.el.dom.innerHTML.length > 0) {\n        Roo.docs.init.loadSource();\n    }\n}"
                },
                "String cls" : "doc-source",
-               "Boolean preventDefault" : true,
                "String href" : "#",
+               "Boolean preventDefault" : true,
                "xtype" : "Link",
                "$ xns" : "Roo.bootstrap",
                "String html" : "Defined in: "
@@ -239,7 +238,7 @@
            "String header" : "Inheritance tree",
            "String cls" : "doc-augments",
            "xtype" : "Container",
-           "String panel" : "success",
+           "String panel" : "primary",
            "$ xns" : "Roo.bootstrap"
           }
          ]
@@ -251,10 +250,10 @@
         "render" : "function (_self)\n{\n    _this.configTableContainer = this;\n}"
        },
        "String header" : "Configuration options",
-       "Boolean expanded" : true,
        "String cls" : "doc-table-container",
+       "Boolean expanded" : true,
        "xtype" : "Container",
-       "String panel" : "info",
+       "String panel" : "primary",
        "$ xns" : "Roo.bootstrap",
        "String style" : "margin-top:15px",
        "Boolean expandable" : true,
@@ -272,8 +271,8 @@
          "items" : [
           {
            "String header" : "",
-           "Number md" : 11,
            "String dataIndex" : "name",
+           "Number md" : 11,
            "$ Function renderer" : "function(v,x,r) { \n\n    return Roo.docs.template.config(r.json);\n\n\t\t\t\n}",
            "xtype" : "ColumnModel",
            "$ xns" : "Roo.grid",
@@ -281,8 +280,8 @@
           },
           {
            "String header" : "<small>Defined by</small>",
-           "Number md" : 1,
            "String dataIndex" : "memberOf",
+           "Number md" : 1,
            "$ Function renderer" : "function(v,x,r) { \n if (r.json.memberOf  == Roo.docs.init.currentClass) {\n            return '';\n        }\n\n\t\treturn \t'<small><a href=\"#' + r.json.memberOf + '\">' + r.json.memberOf + '</a></small>';\n\t\t\t\n}",
            "xtype" : "ColumnModel",
            "$ xns" : "Roo.grid",
@@ -300,8 +299,8 @@
             },
             {
              "xtype" : "ArrayReader",
-             "$ xns" : "Roo.data",
              "$ fields" : "[ 'name', 'type', 'desc', 'memberOf' ]",
+             "$ xns" : "Roo.data",
              "* prop" : "reader"
             }
            ]
@@ -315,9 +314,9 @@
         "render" : "function (_self)\n{\n    _this.methodsTableContainer = this;\n}"
        },
        "String header" : "Constructor, Static and Public Methods",
-       "Boolean expanded" : false,
        "String cls" : "doc-table-container",
-       "String panel" : "info",
+       "Boolean expanded" : true,
+       "String panel" : "primary",
        "xtype" : "Container",
        "$ xns" : "Roo.bootstrap",
        "Boolean expandable" : true,
@@ -334,8 +333,8 @@
          "items" : [
           {
            "String header" : " ",
-           "String dataIndex" : "name",
            "Number md" : 11,
+           "String dataIndex" : "name",
            "$ Function renderer" : "function(v,x,r) { \n\n    return Roo.docs.template.method(r.json);\n\t\t \n\t\t\t\n}",
            "xtype" : "ColumnModel",
            "$ xns" : "Roo.grid",
@@ -344,8 +343,8 @@
           },
           {
            "String header" : "<small>Defined by</small>",
-           "String dataIndex" : "memberOf",
            "Number md" : 1,
+           "String dataIndex" : "memberOf",
            "$ Function renderer" : "function(v,x,r) { \n\n if (r.json.memberOf  == Roo.docs.init.currentClass) {\n            return '';\n        }\n\t\treturn \t'<small><a href=\"#' + r.json.memberOf + '\">' + r.json.memberOf + '</a></small>';\n\t\t\t\n}",
            "xtype" : "ColumnModel",
            "$ xns" : "Roo.grid",
@@ -364,8 +363,8 @@
             },
             {
              "xtype" : "ArrayReader",
-             "$ xns" : "Roo.data",
              "$ fields" : "[ 'name', 'type', 'desc', 'memberOf' ]",
+             "$ xns" : "Roo.data",
              "* prop" : "reader"
             }
            ]
@@ -379,10 +378,10 @@
         "render" : "function (_self)\n{\n    _this.eventsTableContainer   = this;\n}"
        },
        "String header" : "Events",
-       "Boolean expanded" : false,
        "String cls" : "doc-table-container",
+       "Boolean expanded" : true,
        "xtype" : "Container",
-       "String panel" : "info",
+       "String panel" : "primary",
        "$ xns" : "Roo.bootstrap",
        "Boolean expandable" : true,
        "items" : [
@@ -398,8 +397,8 @@
          "items" : [
           {
            "String header" : "",
-           "Number md" : 11,
            "String dataIndex" : "name",
+           "Number md" : 11,
            "$ Function renderer" : "function(v,x,r) { \n\n    return Roo.docs.template.event(r.json);\n\t\t \n\t\t\t\n}",
            "xtype" : "ColumnModel",
            "$ xns" : "Roo.grid",
@@ -407,8 +406,8 @@
           },
           {
            "String header" : "<small>Defined by</small>",
-           "Number md" : 1,
            "String dataIndex" : "memberOf",
+           "Number md" : 1,
            "$ Function renderer" : "function(v,x,r) { \n        if (r.json.memberOf  == Roo.docs.init.currentClass) {\n            return '';\n        }\n\n\t\treturn \t'<small><a href=\"#' + r.json.memberOf + '\">' + r.json.memberOf + '</a></small>';\n\t\t\t\n}",
            "xtype" : "ColumnModel",
            "$ xns" : "Roo.grid",
@@ -421,8 +420,8 @@
            "items" : [
             {
              "xtype" : "ArrayReader",
-             "$ fields" : "[ 'name', 'type', 'desc', 'memberOf' ]",
              "$ xns" : "Roo.data",
+             "$ fields" : "[ 'name', 'type', 'desc', 'memberOf' ]",
              "* prop" : "reader"
             },
             {

diff --git a/docs/Roo.docs.init.js b/docs/Roo.docs.init.js
index ec9b745..b315fb8 100644 (file)
--- a/docs/Roo.docs.init.js
+++ b/docs/Roo.docs.init.js
@@ -5,6 +5,7 @@ Roo.docs.init = {
     classes : false, // flat version of list of classes 
     currentClass : '', // currently viewed class name
     
+    hash : '',
     
     onReady : function()
     {
@@ -24,9 +25,16 @@ Roo.docs.init = {
         Roo.XComponent.on('buildcomplete', function() {
             
             //Roo.XComponent.modules[0].el.fireEvent('render');
-             this.loadTree();
+            this.loadTree();
         }, this);
-        Roo.get(document.body).on('click', this.onClick, this);
+        
+        
+        window.onhashchange = function() { Roo.docs.init.onHashChange(); }
+        
+        
+       
+        
+        //Roo.get(document.body).on('click', this.onClick, this);
       
         
     },
@@ -42,7 +50,7 @@ Roo.docs.init = {
             {
                 var d = Roo.decode(res.responseText);
                 Roo.log(d);
-                this.classes = [];
+                this.classes = {};
                 // our classes witch children first..
                 d.forEach(function(e) {
                     if (e.cn.length) {
@@ -58,6 +66,11 @@ Roo.docs.init = {
                 }, this);
                 var roo = Roo.docs.navGroup.items[1].menu;
                 roo.show(roo.triggerEl, '?', false);
+                if (location.hash.length) {
+                    this.loadHash();
+                    return;
+                }
+                
                 this.loadIntro();
                 
                 
@@ -67,13 +80,26 @@ Roo.docs.init = {
         
         
     },
-    addTreeItem : function(parent, e, type) {
+    
+    hideChildren : function(c)
+    {
+        if (c.node.menu) {
+            c.node.menu.hide();
+        }
+        for (var i =0; i < c.cn.length; i++) {
+            this.hideChildren(c.cn[i]);
+        }
+        
+    },
+    
+    
+    addTreeItem : function(parent, e, type , parent_e) {
         
         this.classes[e.name] = e; 
         // add a node..
         var node = parent.addxtypeChild(Roo.factory({
             html: e.name.split('.').pop(),
-            id : e.name,
+           // id : e.name,
             xns : Roo.bootstrap,
             showArrow: false,
             xtype : type,
@@ -88,14 +114,18 @@ Roo.docs.init = {
                     if (c.cn.length) {
                         Roo.log(ev);
                         if (mi.menu.el.hasClass('show')) {
-                            mi.menu.hide();
+                            this.hideChildren(c); //mi.menu.hide();
+                            // collapse children..
+                            
+                            
+                            
                         } else {
                             mi.menu.show(mi.menu.triggerEl,'?', false);
                         }
                         
                     }
-                    
-                    Roo.docs.init.loadDoc(c);
+                    location.hash = '#' + c.name;
+                    //Roo.docs.init.loadDoc(c);
                     
                 }).createDelegate(this,[e], true)
                 
@@ -119,6 +149,9 @@ Roo.docs.init = {
                 
             })
         }));
+        e.node = node;
+        e.parent_menu = parent;
+        e.parent = parent_e;
         parent.items.push(node);
         if (e.cn.length  && type == 'NavSidebarItem') {
             this.topm = node.menu;
@@ -132,14 +165,14 @@ Roo.docs.init = {
             var cn = ec.name.split('.').pop();
             Roo.log(cn);
             if (cn == cn.toLowerCase()) {
-                this.addTreeItem(node.menu, ec,'MenuItem');
+                this.addTreeItem(node.menu, ec,'MenuItem', e);
             }
             
         }, this);
         e.cn.forEach(function(ec) {
             var cn = ec.name.split('.').pop();
             if (cn != cn.toLowerCase()) {
-                this.addTreeItem(node.menu, ec,'MenuItem');
+                this.addTreeItem(node.menu, ec,'MenuItem', e);
             }
         }, this);
         
@@ -147,7 +180,7 @@ Roo.docs.init = {
     
     loadClass : function(name)
     {
-        if(typeof(this.classes[name]) != 'undefined') {
+        if(typeof(this.classes[name]) != 'undefined' && this.classes[name].is_class ) {
             this.loadDoc(this.classes[name]);
         }
         
@@ -180,10 +213,24 @@ Roo.docs.init = {
     {
         Roo.docs.doc_body_content.hide();
         this.currentClass = cls.name;
-        if (!cls.is_class) {
+        if (!cls ) {
             Roo.docs.introBody.show();
             return;
         }
+        
+        // expand parents..
+        
+        var m = cls.parent_menu;
+        m.show(m.triggerEl,'?', false);
+        var mp = cls;
+        while ((mp = mp.parent)) {
+            m = mp.parent_menu;
+            m.show(m.triggerEl,'?', false);
+        }
+        cls.node.el.scrollIntoView(Roo.docs.sidebar.el,false);
+        Roo.docs.sidebar.el.select('.active').removeClass('active');
+        cls.node.el.addClass('active');
+        
         Roo.docs.introBody.hide();
         Roo.docs.doc_body_content.show();
         Roo.Ajax.request({
@@ -270,6 +317,24 @@ Roo.docs.init = {
         this.loadClass(link);
         
     },
+    
+    onHashChange : function()
+    {
+        if (this.hash == location.hash) {
+            return;
+        }
+        this.loadHash();
+        
+    },
+    loadHash : function()
+    {
+        if (location.hash.length < 2) {
+            this.loadClass('');
+        }
+        this.loadClass(location.hash.substring(1));
+        this.hash = location.hash;
+    },
+    
       
     loadIntro : function()
     {
@@ -292,6 +357,10 @@ Roo.docs.init = {
     // render the really simple markdown data
     renderIntro : function(intro)
     {
+        
+        Roo.docs.doc_body_content.hide();
+
+        
         var lines = intro.split("\n");
         var tree = { 'name' : 'root', cn : []};
         var state = [ tree ];
@@ -375,6 +444,7 @@ Roo.docs.init = {
                                    xtype : 'Link',
                                     href : '#' + ( ll ? ll[1] : treeiii.name ) ,
                                     html : ll ? ll[1] : treeiii.name,
+                                    target : "_new",
                                     xns : Roo.bootstrap 
                                 },
                                 {

diff --git a/docs/Roo.docs.js b/docs/Roo.docs.js
index 9bd6a42..6e6c2dd 100644 (file)
--- a/docs/Roo.docs.js
+++ b/docs/Roo.docs.js
@@ -52,10 +52,10 @@ Roo.docs = new Roo.XComponent({
     {
      xtype : 'NavSidebar',
      cls : 'left-menu-sidebar',
-     style : 'padding-top:80px;',
      listeners : {
       render : function (_self)
        {
+         _this.sidebar = this;
          //  this.el.addClass(language);
            
        }
@@ -201,7 +201,7 @@ Roo.docs = new Roo.XComponent({
            listeners : {
             click : function (e)
              {
-                 document.location.reload();
+                 document.location.hash = '#';
              }
            },
            xns : Roo.bootstrap,
@@ -394,14 +394,15 @@ Roo.docs = new Roo.XComponent({
                  xtype : 'Link',
                  cls : 'doc-extends',
                  html : _this._strings['494a64a432ff6a121e4ab9003c7a0df3'] /* parentcls */,
-                 preventDefault : false,
+                 preventDefault : true,
                  listeners : {
                   click : function (e)
                    {
                    
                        if (this.el.dom.innerHTML.length) {
-                           Roo.docs.init.loadDoc({ name : this.el.dom.innerHTML, is_class : true});
-                       }
+                           document.location.hash = '#' +  this.el.dom.innerHTML;
+                         
+                       } 
                    },
                   render : function (_self)
                    {
@@ -482,7 +483,7 @@ Roo.docs = new Roo.XComponent({
            xtype : 'Container',
            cls : 'doc-augments',
            header : _this._strings['3e6ec55e2dff4342e3f25b0b0b988de9'] /* Inheritance tree */,
-           panel : 'success',
+           panel : 'primary',
            listeners : {
             render : function (_self)
              {
@@ -502,7 +503,7 @@ Roo.docs = new Roo.XComponent({
        expandable : true,
        expanded : true,
        header : _this._strings['50f33d14f129e4548c1c270fd6725a78'] /* Configuration options */,
-       panel : 'info',
+       panel : 'primary',
        style : 'margin-top:15px',
        listeners : {
         render : function (_self)
@@ -595,9 +596,9 @@ Roo.docs = new Roo.XComponent({
        xtype : 'Container',
        cls : 'doc-table-container',
        expandable : true,
-       expanded : false,
+       expanded : true,
        header : _this._strings['a1d108496af420635536a4e29e87d42b'] /* Constructor, Static and Public Methods */,
-       panel : 'info',
+       panel : 'primary',
        listeners : {
         render : function (_self)
          {
@@ -690,9 +691,9 @@ Roo.docs = new Roo.XComponent({
        xtype : 'Container',
        cls : 'doc-table-container',
        expandable : true,
-       expanded : false,
+       expanded : true,
        header : _this._strings['87f9f735a1d36793ceaecd4e47124b63'] /* Events */,
-       panel : 'info',
+       panel : 'primary',
        listeners : {
         render : function (_self)
          {

diff --git a/docs/docs.css b/docs/docs.css
index 14b5637..4325f4d 100644 (file)
--- a/docs/docs.css
+++ b/docs/docs.css
@@ -69,7 +69,7 @@ h6,
 }
 
 .left-menu-sidebar.sidebar .sidebar-menu>li>a, .sidebar .sidebar-menu li.open li.treeview-menu > a {
-    color: #16114C;
+ /*   color: #16114C; */
 }
 
 .left-menu-sidebar.sidebar .left-menu-sidebar-options {
@@ -80,10 +80,6 @@ h6,
     color: #999;
 }
 
-.left-menu-sidebar.sidebar .sidebar-menu > li.active  {
-    background-color: #fff;
-    border-color: #eee;
-}
 
 .mobile-header-menu ul > li.active > a,
 .left-menu-sidebar.sidebar .sidebar-menu > li.active > a  {
@@ -91,8 +87,8 @@ h6,
 }
 
 .left-menu-sidebar.sidebar .sidebar-menu .treeview-menu > li.active {
-    background-color: #fff;
-    border-color: #eee;
+ /*  background-color: #fff;
+    border-color: #eee; */
 }
 
 .left-menu-sidebar.sidebar .sidebar-menu .treeview-menu > li.active > a  {
@@ -110,9 +106,16 @@ h6,
 
 .left-menu-sidebar.sidebar .sidebar-menu > li .treeview-menu a:hover,
 .left-menu-sidebar.sidebar .sidebar-menu > li a:hover {
-    color: #666;
+   /* color: #666; */
     font-weight: bold;
 }
+.left-menu-sidebar.sidebar .sidebar-menu>li.active>a, 
+.sidebar .sidebar-menu li.open li.treeview-menu.active>a
+{
+    color: #fff;
+}
+
+
 /* block the broken bit from sidbar... */
 .sidebar .sidebar-menu li.open li.treeview-menu>a  {
     display: none;
@@ -194,10 +197,16 @@ h6,
 
 .left-menu-sidebar {
     position: fixed;
-    width: 250px; /*320px;*/
-    height: 100%;
     top: 0;
     left: 0;
+    bottom: 0px;
+    margin-top: 80px;
+    height: auto;
+    padding-bottom: 0;
+    margin-bottom: 0;
+    
+    width: 250px; /*320px;*/
+    
     z-index: 999;
     background-repeat: no-repeat;
     background-position: center center;