Merge pull request #2605 from tschaub/stable-doc

Hide unstable items from the API docs by default.

config/jsdoc/api/plugins/observable.js

@@ -34,6 +34,9 @@ exports.handlers = {
         } else if (doclet.name.indexOf('set') === 0) {
           observable.readonly = false;
         }
+        if (doclet.stability) {
+          observable.stability = doclet.stability;
+        }
         if (!cls.observables) {
           cls.observables = [];
         }

config/jsdoc/api/template/static/scripts/main.js

@@ -52,4 +52,13 @@ $(function () {
 
     $(window).on('resize', _onResize);
     _onResize();
+
+    // show/hide unstable items
+    var unstable = $('.unstable');
+    var stabilityToggle = $('#stability-toggle');
+    stabilityToggle.change(function() {
+        unstable.toggle(!this.checked);
+        return false;
+    });
+    unstable.toggle(!stabilityToggle[0].checked);
 });

config/jsdoc/api/template/static/styles/jaguar.css

@@ -286,7 +286,6 @@ span.type-signature.static {
   width: 110px;
 }
 .main table .type {
-  width: 60px;
   color: #aaa;
   font-size: 12px;
 }
@@ -373,3 +372,12 @@ footer {
 .main .readme table ul li {
   margin-bottom: 0;
 }
+.unstable {
+  display: none;
+}
+#stability {
+  color: white;
+  position: absolute;
+  top: 1em;
+  right: 8em;
+}

config/jsdoc/api/template/tmpl/layout.tmpl

@@ -18,8 +18,11 @@
 <div class="navbar navbar-inverse navbar-fixed-top">
   <div class="navbar-inner">
     <div class="container">
-      <a class="brand" href="/"><img src="../resources/logo.png"> OpenLayers 3</a>
+      <a class="brand" href="/"><img src="../resources/logo.png" width="40"> OpenLayers 3</a>
       <a class="brand" href="index.html">API Documentation</a>
+      <label id="stability">
+        <input type="checkbox" id="stability-toggle" checked> Stable Only
+      </label>
     </div>
   </div>
 </div>

config/jsdoc/api/template/tmpl/method.tmpl

@@ -2,7 +2,7 @@
 var data = obj;
 var self = this;
 ?>
-<dt>
+<dt class="<?js= (data.stability && data.stability !== 'stable') ? 'unstable' : '' ?>">
     <div class="nameContainer<?js if (data.inherited) { ?> inherited<?js } ?>">
         <?js if (data.stability || kind !== 'class') { ?>
         <h4 class="name" id="<?js= id ?>">
@@ -23,7 +23,7 @@ var self = this;
     <p class="summary"><?js= summary ?></p>
     <?js } ?>
 </dt>
-<dd>
+<dd class="<?js= (data.stability && data.stability !== 'stable') ? 'unstable' : '' ?>">
     
     <?js if (data.description) { ?>
     <div class="description">
@@ -67,7 +67,7 @@ var self = this;
               description = eventDoclet.description.replace(/<[^>]*>/g, '');
             }
         ?>
-        <li>
+        <li class="<?js= (eventDoclet || data).stability !== 'stable' ? 'unstable' : '' ?>">
             <code><?js= self.linkto(f, type) ?></code>
             <?js if (eventClassName) {
               var eventClass = self.find({longname: eventClassName})[0];

config/jsdoc/api/template/tmpl/navigation.tmpl

@@ -54,36 +54,9 @@ var self = this;
 
                 item.methods.forEach(function (v) {
             ?>
-                <li data-name="<?js= v.longname ?>"><?js= self.linkto(v.longname, v.name) ?></li>
+                <li data-name="<?js= v.longname ?>" class="<?js= v.stability !== 'stable' ? 'unstable' : ''?>">
-            <?js
+                    <?js= self.linkto(v.longname, v.name) ?>
-                });
+                </li>
-            }
-            ?>
-            </ul>
-            <ul class="fires itemMembers">
-            <?js
-            if (item.fires && item.fires.length) {
-            ?>
-            <span class="subtitle">Fires</span>
-            <?js
-                item.fires.forEach(function (v) {
-                    v = self.find({longname: v})[0] || {longname: v, name: v.split(/#?event:/)[1]};
-            ?>
-                <li data-name="<?js= v.longname ?>"><?js= self.linkto(v.longname, v.name) ?></li>
-            <?js
-                });
-            }
-            ?>
-            </ul>
-            <ul class="events itemMembers">
-            <?js
-            if (item.events.length) {
-            ?>
-            <span class="subtitle">Events</span>
-            <?js
-                item.events.forEach(function (v) {
-            ?>
-                <li data-name="<?js= v.longname ?>"><?js= self.linkto(v.longname, v.name) ?></li>
             <?js
                 });
             }

config/jsdoc/api/template/tmpl/observables.tmpl

@@ -21,7 +21,7 @@
         var setter = prop.readonly ? 'no' : 'yes';
   ?>
 
-    <tr>
+    <tr class="<?js= prop.stability !== 'stable' ? 'unstable' : '' ?>">
       <td class="name"><code><?js= prop.name ?></code></td>
       <td class="type">
       <?js if (prop.type && prop.type.names) {?>

config/jsdoc/api/template/tmpl/params.tmpl

@@ -71,7 +71,7 @@
 	        if (!param) { return; }
 	?>
 	
-        <tr>
+        <tr class="<?js= (param.stability && param.stability !== 'stable') ? 'unstable' : '' ?>">
             <?js if (params.hasName) {?>
                 <td class="name"><code><?js= param.name.replace(/^opt_/, "") ?></code></td>
             <?js } ?>