bug: Drawer closes now like expected (Styleguide)

MikeMitterer · Feb 24, 2015 · df1d34c · df1d34c
1 parent 907a55b
commit df1d34c
Show file tree

Hide file tree

Showing 4 changed files with 28 additions and 2 deletions.
diff --git a/WskMaterial.iml b/WskMaterial.iml
@@ -5,6 +5,7 @@
     <content url="file://$MODULE_DIR$">
       <excludeFolder url="file://$MODULE_DIR$/.pub" />
       <excludeFolder url="file://$MODULE_DIR$/build" />
+      <excludeFolder url="file://$MODULE_DIR$/example/accordion/packages/wsk_material" />
       <excludeFolder url="file://$MODULE_DIR$/example/accordion/web/packages" />
       <excludeFolder url="file://$MODULE_DIR$/example/animation/packages/wsk_material" />
       <excludeFolder url="file://$MODULE_DIR$/example/animation/web/packages" />

diff --git a/example/main.dart b/example/main.dart
@@ -22,6 +22,12 @@ main() {
 void loadDemos() {
     final html.HtmlElement navList = html.querySelector('#main-navigation');
     int totalDemosPendingLoading = 0;
+    html.HtmlElement _drawer = null;
+
+    html.HtmlElement getDrawer() {
+        if(_drawer == null) { _drawer = html.querySelector('.wsk-layout__drawer'); }
+        return _drawer;
+    }
 
     void _sizeDemo(final html.HtmlElement rootDemoElement) {
         final html.IFrameElement iframe = rootDemoElement.querySelector("iframe");
@@ -38,7 +44,7 @@ void loadDemos() {
             // contentDocument.documentElement is not implemented in Dart!!!!!
             final int contentHeight = jsIFrame["contentDocument"]["documentElement"]["scrollHeight"];
 
-            iframe.style.height = "${contentHeight * 1.5}px";
+            iframe.style.height = "${contentHeight * 1.2}px";
             iframe.classes.add("heightSet");
             totalDemosPendingLoading--;
             _setLoaderInfo(totalDemosPendingLoading);
@@ -67,6 +73,14 @@ void loadDemos() {
             navAnchor.append(new html.Text("${demoTitle}"));
             navList.append(navAnchor);
 
+            navAnchor.onClick.listen((final html.MouseEvent event) {
+                print("Test");
+                if(getDrawer() != null) {
+                    getDrawer().classes.toggle("is-visible");
+                }
+            });
+
+
             final html.AnchorElement anchor = new html.AnchorElement();
             anchor.id = anchorLink;
             demos[i].insertBefore(anchor, demos[i].querySelector('h1'));

diff --git a/example/styleguide.html b/example/styleguide.html
@@ -21,7 +21,8 @@
 <body class="loadingDemos">
 <div class="wsk-layout wsk-js-layout wsk-layout--fixed-drawer wsk-styleguide">
     <div class=wsk-layout__drawer><span class=wsk-layout-title>WSK <strong>Style Guide</strong></span>
-        <nav id=main-navigation class=wsk-navigation></nav>
+        <nav id=main-navigation class=wsk-navigation>
+        </nav>
     </div>
     <div class=wsk-layout__content>
         <div class="loader">Wait! Loading more than 20 iframes...</div>

diff --git a/lib/src/components/MaterialLayout.dart b/lib/src/components/MaterialLayout.dart
@@ -30,6 +30,8 @@ class _MaterialLayoutCssClasses {
     final String TAB_BAR_RIGHT_BUTTON = 'wsk-layout__tab-bar-right-button';
     final String PANEL = 'wsk-layout__tab-panel';
 
+    final String NAVI_LINK = "wsk-navigation__link";
+
     final String SHADOW_CLASS = 'is-casting-shadow';
     final String COMPACT_CLASS = 'is-compact';
     final String SMALL_SCREEN_CLASS = 'is-small-screen';
@@ -179,11 +181,19 @@ class MaterialLayout extends WskComponent {
                     element.insertBefore(drawerButton, content);
                 }
 
+                _logger.info("Check: .${_cssClasses.NAVI_LINK}");
+                element.querySelectorAll(".${_cssClasses.NAVI_LINK}").forEach((final html.Element element) {
+                    _logger.info("click $element");
+                    element.onClick.listen( _drawerToggleHandler );
+                });
+
                 final html.DivElement obfuscator = new html.DivElement();
                 obfuscator.classes.add(_cssClasses.OBFUSCATOR);
                 element.append(obfuscator);
 
                 obfuscator.onClick.listen( _drawerToggleHandler );
+
+
             }
 
             // Initialize tabs, if any.