add example toggler for dashboard

docs/examples/dashboard/example.js

@@ -23,5 +23,24 @@ function setDrawerPosition(position){
         setDrawerPosition('mdb-' + position)
       })
     })
-  }, 10)
+
+    // add a toggle for drawer visibility that shows anytime
+    $('#drawer-visibility').click(function(){
+      var $container = $('.mdb-layout-container')
+
+      // once clicked, just do away with responsive marker
+      $container.removeClass('mdb-drawer-open-md')
+
+      var $icon = $(this).find('.material-icons')
+      if($icon.text() == 'visibility_off'){
+        $container.removeClass('mdb-drawer-open')
+        $icon.text('visibility')
+      }
+      else {
+        $container.addClass('mdb-drawer-open')
+        $icon.text('visibility_off')
+      }
+    })
+
+  }, 100)
 })();

docs/examples/dashboard/index.html

@@ -6,7 +6,6 @@ group: material-design
 
 <!-- Custom styles for this template -->
 <link href="example.css" rel="stylesheet">
-<script src="example.js"></script>
 
 <div class="mdb-layout-canvas">
   <div class="mdb-layout-container mdb-drawer-fixed-left mdb-drawer-open-md">
@@ -32,6 +31,11 @@ group: material-design
           </li>
         </ul>
         <ul class="nav navbar-nav pull-xs-right">
+          <li class="nav-item">
+            <button class="btn mdb-btn-icon" title="Drawer toggle" id="drawer-visibility">
+              <i class="material-icons">visibility_off</i>
+            </button>
+          </li>
           <li class="nav-item">
             <button class="btn mdb-btn-icon" title="Drawer left" id="drawer-fixed-left">
               <i class="material-icons">border_left</i>
@@ -292,3 +296,6 @@ group: material-design
   </defs>
 </svg>
 </div>
+
+
+<script src="example.js"></script>