Wrap content into divs + more demo examples

TheRusskiy · Mar 18, 2016 · dae8506 · dae8506
1 parent 845f7e0
commit dae8506
Show file tree

Hide file tree

Showing 6 changed files with 46 additions and 13 deletions.
diff --git a/demo/index.html b/demo/index.html
@@ -9,10 +9,43 @@
   <link rel="stylesheet" href="style.css"/>
 </head>
 <body ng-controller="MyCtrl"  ng-cloak>
+  <div ng-click="widgetExpandedLazy = !widgetExpandedLazy" class="head">
+    Lazy, initial false
+  </div>
+  <div ng-slide-down="widgetExpandedLazy" lazy-render duration="1">
+    <div class="content">
+      Some awesome content here
+    </div>
+  </div>
+  <div class="footer">
+    After content
+  </div>
   <div ng-click="widgetExpanded = !widgetExpanded" class="head">
-    Click to slide in/out
+    Non lazy, initial false
+  </div>
+  <div ng-slide-down="widgetExpanded" duration="1">
+    <div class="content">
+      Some awesome content here
+    </div>
+  </div>
+  <div class="footer">
+    After content
+  </div>
+  <div ng-init="widgetExpandedLazyTrue = true" ng-click="widgetExpandedLazyTrue = !widgetExpandedLazyTrue" class="head">
+    Lazy, initial true
+  </div>
+  <div ng-slide-down="widgetExpandedLazyTrue" lazy-render duration="1">
+    <div class="content">
+      Some awesome content here
+    </div>
+  </div>
+  <div class="footer">
+    After content
+  </div>
+  <div ng-init="widgetExpandedTrue = true" ng-click="widgetExpandedTrue = !widgetExpandedTrue" class="head">
+    Non lazy, initial true
   </div>
-  <div ng-slide-down="widgetExpanded" lazy-render duration="1">
+  <div ng-slide-down="widgetExpandedTrue" duration="1">
     <div class="content">
       Some awesome content here
     </div>
@@ -21,4 +54,4 @@
     After content
   </div>
 </body>
-</html>
+</html>
diff --git a/demo/ng-slide-down.js b/demo/ng-slide-down.js
@@ -6,9 +6,9 @@
       var getTemplate, link;
       getTemplate = function (tElement, tAttrs) {
         if (tAttrs.lazyRender !== void 0) {
-          return '<div ng-if=\'lazyRender\' ng-transclude></div>';
+          return '<div><div ng-transclude ng-if=\'lazyRender\'></div></div>';
         } else {
-          return '<div ng-transclude></div>';
+          return '<div><div ng-transclude></div></div>';
         }
       };
       link = function (scope, element, attrs, ctrl, transclude) {

diff --git a/dist/ng-slide-down.js b/dist/ng-slide-down.js
@@ -6,9 +6,9 @@
       var getTemplate, link;
       getTemplate = function (tElement, tAttrs) {
         if (tAttrs.lazyRender !== void 0) {
-          return '<div ng-if=\'lazyRender\' ng-transclude></div>';
+          return '<div><div ng-transclude ng-if=\'lazyRender\'></div></div>';
         } else {
-          return '<div ng-transclude></div>';
+          return '<div><div ng-transclude></div></div>';
         }
       };
       link = function (scope, element, attrs, ctrl, transclude) {

diff --git a/dist/ng-slide-down.min.js b/dist/ng-slide-down.min.js
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "ng-slide-down",
-  "version": "0.4.2",
+  "version": "1.0.0",
   "description": "Slider animation directive for AngularJS",
   "homepage": "https://github.com/TheRusskiy/ng-slide-down",
   "scripts": {

diff --git a/src/ng-slide-down.coffee b/src/ng-slide-down.coffee
@@ -2,9 +2,9 @@
 angular.module("ng-slide-down", []).directive "ngSlideDown", ($timeout )->
   getTemplate = (tElement, tAttrs)->
     if tAttrs.lazyRender != undefined
-      "<div ng-if='lazyRender' ng-transclude></div>"
+      "<div><div ng-transclude ng-if='lazyRender'></div></div>"
     else
-      "<div ng-transclude></div>"
+      "<div><div ng-transclude></div></div>"
 
   link = (scope, element, attrs, ctrl, transclude) ->
     duration = attrs.duration || 1
@@ -79,4 +79,4 @@ angular.module("ng-slide-down", []).directive "ngSlideDown", ($timeout )->
     transclude: true
     link: link
     template: (tElement, tAttrs)-> getTemplate(tElement, tAttrs)
-  }
+  }